Sign In With Google HTML API Sign In + Sign Up buttons on the same page

jtubre 0
Viewed 35

I have an HTML modal with a "Sign In" and a "Sign Up" tab. Each tab offer users the ability to "Sign In" or "Sign Up" with Google.

Google's reference states that I should only include the g_id_onload in one element per page. Google treats either context: 'signin' vs 'signup' the same in the backend. Is there a way to capture which g_id_signin button was clicked if I have multiple buttons on the page, so I can give the user proper feedback?

eg: "Thanks for signing up!", "Successfully signed in", "Account does not exist. Please sign up first."

google-signin api
1 Answers

A hacky work around: while Google's reference shows it inside the g_id_onload container, you can also set the data-nonce attribute in the g_id_signin (button) container instead. It appears to be one of few (if not the only) custom data-attributes you can provide and get back in the payload response.

For a given sign in button, set the data-nonce to 'signin' / 'signup' data-nonce=[context] Or if you have need for a proper nonce, come up with (2) distinct for each context.

On successful verify, the nonce attribute in the payload response will let you know which button the user clicked.

jtubre0
Related