Supabase Auth: redirects to Google.com instead of my app

Question

Following this tutorial, after the Google login i'm redirected to Google.com instead of bringing me back to my app. How could I solve this issue?

Sample code of the login page:

class _LoginScreenState extends State<LoginScreen> {
  final supabase = Supabase.instance.client;
  @override
  void initState() {
    _setupAuthListener();
    super.initState();
  }

  void _setupAuthListener() {
    supabase.auth.onAuthStateChange.listen((data) {
      final event = data.event;
      if (event == AuthChangeEvent.signedIn) {
        Navigator.of(context).pushReplacement(
          MaterialPageRoute(
            builder: (context) => const ProfileScreen(),
          ),
        );
      }
    });
  }

  /// Function to generate a random 16 character string.
  String _generateRandomString() {
    final random = Random.secure();
    return base64Url.encode(List<int>.generate(16, (_) => random.nextInt(256)));
  }

  @override
  Widget build(BuildContext context) {
    return  Center(
        child: ElevatedButton(
          onPressed: () async {
            const appAuth = FlutterAppAuth();

            final rawNonce = _generateRandomString();
            final hashedNonce =
            sha256.convert(utf8.encode(rawNonce)).toString();

            final clientId =
             'MYCLIENTID';

            /// Set as reversed DNS form of Google Client ID + `:/` for Google login
            final redirectUrl = '${clientId.split('.').reversed.join('.')}:/';
            

            const discoveryUrl =
                'https://accounts.google.com/.well-known/openid-configuration';

            // authorize the user by opening the concent page
            final result = await appAuth.authorize(
              AuthorizationRequest(
                clientId,
                redirectUrl,
                discoveryUrl: discoveryUrl,
                nonce: hashedNonce,
                scopes: [
                  'openid',
                  'email',
                  'profile',
                ],
              ),
            );

            if (result == null) {
              throw 'No result';
            }

            // Request the access and id token to google
            final tokenResult = await appAuth.token(
              TokenRequest(
                clientId,
                redirectUrl,
                authorizationCode: result.authorizationCode,
                discoveryUrl: discoveryUrl,
                codeVerifier: result.codeVerifier,
                nonce: result.nonce,
                scopes: [
                  'openid',
                  'email',
                ],
              ),
            );

            final idToken = tokenResult?.idToken;

            if (idToken == null) {
              throw 'No idToken';
            }

            await supabase.auth.signInWithIdToken(
              provider: Provider.google,
              idToken: idToken,
              nonce: rawNonce,
            );
          },
          child: const Text('Google login'),
        ),
      );
  }
}

Build.gradle:

  defaultConfig {
        
        applicationId "com.user.appname"
        minSdkVersion 33
        targetSdkVersion flutter.targetSdkVersion
        versionCode flutterVersionCode.toInteger()
        versionName flutterVersionName
        manifestPlaceholders += [
                'appAuthRedirectScheme': applicationId
        ]
    }

The code is the same from the Supabase docs linked above. Hoping to find a solution to this. If you have any question feel free to leave a comment

After `final redirectUrl = '${clientId.split('.').reversed.join('.')}:/';` add `print(redirectUrl);` and update the question with the result. — Richard Heap, Aug 25 '23 at 01:12
Is this happening on Android, iOS, or both? My guess would be that you do not have the manifest placeholders set properly as described here. https://supabase.com/blog/flutter-authentication#:~:text=We%20also%20need%20some%20Android%20specific%20settings You also need to set your Client ID in the Dart code, but have you done that? — dshukertjr, Aug 25 '23 at 05:50
@RichardHeap it prints the Client Id registered in the GCP (correctly reversed, a long string) — faccio, Aug 25 '23 at 07:23
@dshukertjr yes on Android. I correctly setup the build.gradle file and changed the client id — faccio, Aug 25 '23 at 07:24
@RichardHeap it prints the Client Id registered in the GCP (com.googleusercontent.apps.....) — faccio, Aug 25 '23 at 13:54
What happens if you visit redirectUrl directly in your browser? — Richard Heap, Aug 26 '23 at 02:59

score 1 · Accepted Answer · answered Aug 26 '23 at 04:59

Your appAuthRedirectScheme doesn't match the redirect URL provided in your Flutter code. You can update your build.gradle file like this to match the redirect URL in your Flutter code.

defaultConfig {
    applicationId "com.user.appname"
    minSdkVersion 33
    targetSdkVersion flutter.targetSdkVersion
    versionCode flutterVersionCode.toInteger()
    versionName flutterVersionName
    manifestPlaceholders += [
        'appAuthRedirectScheme':'com.googleusercontent.apps.*account_id*'
    ]
}

Supabase Auth: redirects to Google.com instead of my app

1 Answers1