Login with Google

1. Configure OAuth credentials for your Google Cloud project in the Credentials page of the console. When creating a new OAuth client ID, choose Android or iOS depending on the mobile operating system your app is built for.
   • For Android, use the instructions on screen to provide the SHA-1 certificate fingerprint used to sign your Android app.
     • You will have a different set of SHA-1 certificate fingerprint for testing locally and going to production. Make sure to add both to the Google Cloud Console. and add all of the Client IDs to Supabase dashboard.
   • For iOS, use the instructions on screen to provide the app Bundle ID, and App Store ID and Team ID if the app is already published on the Apple App Store.
2. Configure the OAuth Consent Screen. This information is shown to the user when giving consent to your app. In particular, make sure you have set up links to your app's privacy policy and terms of service.
3. Finally, add the client ID from step 1 in the Google provider on the Supabase Dashboard, under Client IDs.

Note that you do not have to configure the OAuth flow in the Supabase Dashboard in order to use native sign in.

Unlike the OAuth flow which requires the use of a web browser, the native Sign in with Google flow on Android uses the operating system's built-in functionalities to prompt the user for consent. Note that native sign-in has been rebranded as One Tap sign-in on Android by Google, which you should not confuse with One Tap sign in for web, as mentioned below.

When the user provides consent, Google issues an identity token (commonly abbreviated as ID token) that is then sent to your project's Supabase Auth server. When valid, a new user session is started by issuing an access and refresh token from Supabase Auth.

By default, Supabase Auth implements nonce validation during the authentication flow. This can be disabled in production under Authentication > Providers > Google > Skip Nonce Check in the Dashboard, or when developing locally by setting auth.external.<provider>.skip_nonce_check. Only disable this if your client libraries cannot properly handle nonce verification.

When working with Expo, you can use the react-native-google-signin/google-signin library library to obtain an ID token that you can pass to supabase-js signInWithIdToken method.

Follow the Expo installation docs for installation and configuration instructions. See the supabase-js reference for instructions on initializing the supabase-js client in React Native.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
import {  GoogleSignin,  GoogleSigninButton,  statusCodes,} from '@react-native-google-signin/google-signin'import { supabase } from '../utils/supabase'export default function () {  GoogleSignin.configure({    scopes: ['https://www.googleapis.com/auth/drive.readonly'],    webClientId: 'YOUR CLIENT ID FROM GOOGLE CONSOLE',  })  return (    <GoogleSigninButton      size={GoogleSigninButton.Size.Wide}      color={GoogleSigninButton.Color.Dark}      onPress={async () => {        try {          await GoogleSignin.hasPlayServices()          const userInfo = await GoogleSignin.signIn()          if (userInfo.data.idToken) {            const { data, error } = await supabase.auth.signInWithIdToken({              provider: 'google',              token: userInfo.data.idToken,            })            console.log(error, data)          } else {            throw new Error('no ID token present!')          }        } catch (error: any) {          if (error.code === statusCodes.SIGN_IN_CANCELLED) {            // user cancelled the login flow          } else if (error.code === statusCodes.IN_PROGRESS) {            // operation (e.g. sign in) is in progress already          } else if (error.code === statusCodes.PLAY_SERVICES_NOT_AVAILABLE) {            // play services not available or outdated          } else {            // some other error happened          }        }      }}    />  )}