google-signin: supabase signInWithIdToken not working: Nonces mismatch

// using this library for decoding
import jwtDecode from 'jwt-decode'

const handleLogin = async () => {
    setLoading(true);
    try {
      await GoogleSignin.hasPlayServices();
      const u = await GoogleSignin.signIn();
      // get the nonce value
      const nonce = jwtDecode<any>(u.idToken!);
      const { nonce: nonceVal } = nonce!;
      // login to supabase
      const { data, error } = await supabase.auth.signInWithIdToken({
        provider: 'google',
        token: u.idToken!,
        nonce: nonceVal,
      });
      console.log('supabase data:', data);
      if (error) {
        console.log('Supabase error:', error);
      }
      if (data.user) {
        // do something
      }
    } catch (err) {
      console.log(err);
    } finally {
      setLoading(false);
    }
  };

About this issue

Original URL
State: open
Created a year ago
Reactions: 17
Comments: 16 (3 by maintainers)

Links to this issue

nonce issue for signInWithIdToken

Most upvoted comments

I’ve been blocked on this for a while now. My code is nearly identical to the OP. I’m getting the nonce from jwt-decode, but passing it in the signInWithIdToken() call only changes the error from ‘Passed nonce and nonce in id_token should either both exist or not’ to nonces mismatch. Anyone have any suggestions or solutions?

It seems like the signInWithIdToken() isn’t behaving as expected, or I’m missing something.

timdobranski on Jul 19, 2023

Hello and thanks for reporting, ~I did not test this, and it may not work, but~ the next version of the google sign in library obtainable for sponsors here allows passing custom nonce. Maybe that will work. edit: it only allows that on Android

edit2: I tested this and it works, can be used like this:

 const nonce = Crypto.randomUUID()
 const hashedNonce = await digestStringAsync(CryptoDigestAlgorithm.SHA256, nonce)
 const userInfo = await GoogleOneTapSignIn.signIn({
      webClientId,
      nonce: hashedNonce,
    })

Thank you 🙂

vonovak on Sep 22, 2023

I am having the same problem, it seems like @react-native-google-signin/google-signin and supabase are not compatible because there is currently no way to get the nonce value expected by supabase signInWithIdToken method

codypl on Sep 26, 2023

quick update: passing custom nonce works as outlined in the post above, for Android.

For iOS, I confirm that a valid idToken for supabase can be obtained using https://docs.expo.dev/versions/latest/sdk/auth-session/ (edit: no need to use any of the deprecated APIs)

edit2: please note rn-google sign in does not expose nonce option because the underlying native sdk doesn’t expose it either

vonovak on Oct 13, 2023

Hate to say it, but it doesn’t look like this will work currently. Supabase requires a nonce if it’s in the token, and react native doesn’t expose the nonce in its current implementation. Unless I’ve got something wrong, native signin on iOS with supabase and react-native isn’t possible at this time. Either supabase has to modify the endpoint (unlikely) or react-native has to expose the nonce (unlikely any time soon, I assume).

timdobranski on Jul 21, 2023

To my understanding Supabase expects the nonce to be the decoded version of the nonce present in the ID token received from google, hence why passing the nonce from the ID token doesnt work as it will get its hash and match them for equality. Unfortunately I cannot find any way to get the nonce before its encoded in the ID token. Any ideas?

/** If the ID token contains a `nonce` claim, then the hash of this value is compared to the value in the ID token. */
nonce?: string

Eirmas on Jul 20, 2023