Aryan
Aryan

Reputation: 111

How to sign out using Google Identity API?

I have used the Google Identity API to sign in to the user. It works perfectly while signing in. But the sign-out doesn't work I don't know why.

This is the sign-out code:

  const button = document.getElementById('signout_button');
   button.onclick = () => {
   google.accounts.id.disableAutoSelect();
   console.log('logged out');
};

But it doesn't work even if press the button.

I want this google box to turn into the button sign in after I sign out but it doesnt work:

enter image description here

Upvotes: 3

Views: 2056

Answers (1)

bdid
bdid

Reputation: 565

You're doing the right thing by calling disableAutoSelect() in your sign-out onclick handler, but it only applies to and controls the behavior for the automatic sign-in button. It doesn't affect One Tap or the Sign In With Google button.

To further clarify what it means to be signed in... there are two user sessions:

  1. between the user and their Google Account
  2. between the user and your app

You'll manage 2, but 1 is not managed by you. For 1 users may be signed into their Google Account from a tab, the browser, or a device/OS. This establishes which Google Account has an active session. The state of this session is independent from 2 where you're managing sign-in or sign-out status for your app.

For case 2: sign-in to your site you'll receive a JWT from Google after user consent and can proceed with changing the sign in state for your app. One means of track sign-in state is using cookies. To make this easier to manage in HTML, the data-skip_prompt_cookie attribute is available to enable you to use a cookie to control if the One Tap popup, automatic sign-in option will be displayed, or not. You'd normally want to suppress the popup if the user is signed-in... and the cookie value tracks signed-in status. If you're using JavaScript your simply skip calling google.accounts.id.prompt to not force the user to sign-in again if they're already signed into your site.

OK. Now that we've gone over a couple methods to establish 2. we can get to what it means to be signed out of your site...

To sign-out, from your button.onclick handler either clear the data-skip_prompt_cookie or change the status if you are using JavaScript to tracking session state using your back end. This then will enable you to display One Tap popup or Automatic sign-in prompt to signed-out users on their return visit to your site. The absence of the cookie means the sign-in prompts will be displayed, or your JS code will call google.accounts.id.prompt to display the sign-in prompts.

Now to be really thorough there is one more scenario to be aware of. If a user wants to delete their account from your site you'll want to use google.accounts.id.revoke to revoke consent to share their profile. Doing this will stop the JWT from being shared when One Tap, automatic sign-in or Sign In With Google buttons are used. Instead, the flow will restart and the user will be prompted to choose a Google Account and consent--effectively restarting your sign-in flow for 2.

Upvotes: 7

Related Questions