Sign in with Google fails on a custom domain

What it means in plain English

Google only accepts the origins and redirect URLs you listed on the OAuth client. The preview on localhost can be on that list while https://yourdomain.com is not. Supabase and Firebase each add a second list of their own.

Supabase's Google guide says Authorized JavaScript origins are your application's URL, and that the same URL should be the Site URL or a redirect in the Supabase project. If the app is hosted at https://example.com/app, you add https://example.com. That is the origin, not the path. Authorized redirect URIs are the Supabase callback, which you copy from the Google provider page in the Dashboard. For local Supabase that callback is http://127.0.0.1:54321/auth/v1/callback.

Firebase provisions https://my-app-12345.firebaseapp.com and uses it as the OAuth redirect. To show your own domain instead, Firebase's Google sign-in guide says to add the custom domain to authorized domains, allow https://auth.custom.domain.com/__/auth/handler on the OAuth client, and set authDomain to that custom domain when you initialize the SDK.

Likely causes

• Authorized JavaScript origins still has http://localhost: and not the production origin. Supabase says to remove the localhost entry when the app goes to production.
• The redirect URI is the site's /login page instead of the Supabase callback.
• For a PKCE flow, redirectTo is not on the Supabase redirect allow list.
• Firebase authDomain is still your-project.firebaseapp.com, or the custom domain was never added to authorized domains. The client error for that is Firebase auth/unauthorized-domain.
• The Google error is redirect_uri_mismatch. That check is Google OAuth redirect_uri_mismatch.

How to fix it, step by step

1. In the Google Auth Platform console, open the Web application client. Under Authorized JavaScript origins, add the live origin only: https://yourdomain.com, with no path and no trailing page. Supabase's example for a site at https://example.com/app is https://example.com.
2. Under Authorized redirect URIs, add the Supabase callback from the Google provider page. Do not invent a path on your own domain for that box unless Firebase is the auth host. For Firebase, the guide's URI is https://auth.custom.domain.com/__/auth/handler.
3. In Supabase, set the Site URL to the live origin and add that origin to the redirect allow list. If login still returns to http://localhost:3000, that is Supabase login redirects to localhost.
4. In Firebase, add the custom domain under authorized domains, set authDomain to the domain that serves the app, and redeploy. Hosting has to be on the same project you use for Authentication. If you are not on Firebase Hosting, Firebase's redirect guide says to use one of the other options, such as signInWithPopup, instead of only changing authDomain.
5. A Lovable app has its own publish and domain steps before these lists matter. See Lovable Google sign-in on a custom domain.

How to check it worked

• Sign-in started on https://yourdomain.com returns to that origin with a session.
• The Google error screen no longer says the JavaScript origin or the redirect URI is not authorized.
• localhost is not required for the production client.

Sources

• https://supabase.com/docs/guides/auth/social-login/auth-google (opens in a new tab)
• https://firebase.google.com/docs/auth/web/google-signin (opens in a new tab)
• https://firebase.google.com/docs/auth/web/redirect-best-practices (opens in a new tab)