Logging Out

Sign users out and prevent automatic re-sign-in with googleLogout.

The googleLogout function calls Google’s disableAutoSelect() API, which tells Google’s SDK to stop automatically signing the user back in on their next visit.

Basic usage

import { googleLogout } from '@react-oauth/google';

function LogoutButton() {
  const handleLogout = () => {
    googleLogout();
    // Clear your own session state here
  };

  return <button onClick={handleLogout}>Sign out</button>;
}

Why you need googleLogout

If you use One Tap or automatic sign-in (auto_select), not calling googleLogout() when the user signs out can cause Google to automatically sign them back in on their next page load — even if they explicitly signed out.

When a user signs out, you need to:

1. Call googleLogout() — disables Google’s auto-select for this user
2. Clear your own application session (e.g., remove the JWT, clear cookies, reset state)

googleLogout() does not revoke the user’s Google Account tokens or sign them out of Google globally. It only prevents the Google Identity Services SDK from automatically re-signing them into your application.

Complete logout flow

1. Call googleLogout

   Disable Google’s auto-select so the user isn’t signed back in automatically.

   import { googleLogout } from '@react-oauth/google';
   
   googleLogout();
   
2. Clear your application session

   Remove any tokens or session data your app holds. The exact approach depends on how you store the session:

   // If you store in state
   setUser(null);
   
   // If you store in localStorage
   localStorage.removeItem('access_token');
   
   // If your backend manages the session, call your logout endpoint
   await fetch('/api/auth/logout', { method: 'POST' });
   
3. Update the UI

   Redirect the user or update your app state to reflect the signed-out state.

   router.push('/login');
   

Full example

import { googleLogout } from '@react-oauth/google';
import { useState } from 'react';

function App() {
  const [credential, setCredential] = useState<string | null>(null);

  const handleLogout = () => {
    googleLogout();       // Prevent Google auto sign-in
    setCredential(null);  // Clear your app session
  };

  if (!credential) {
    return <p>Please sign in.</p>;
  }

  return (
    <div>
      <p>You are signed in.</p>
      <button onClick={handleLogout}>Sign out</button>
    </div>
  );
}

Tips

If you redirect the user to a login page after signing out, place googleLogout() before the redirect so the SDK state is cleared before the page navigates.

googleLogout() is a no-op if Google’s SDK hasn’t loaded yet. It is safe to call at any time.