Custom authDomain in Firebase

Question

I am using Firebase's built-in oAuth feature for an SPA.

This SPA is on a domain of it's own, say foobar.com

The problem is, when the oauth popup is opened, the old foobar.firebaseapp.com domain is used, instead of the new foobar.com domain

My init looks like this

firebase.initializeApp({
  apiKey: '...',
  authDomain: 'foobar.firebaseapp.com',
  databaseURL: 'https://foobar.firebaseio.com',
  storageBucket: 'foobar.appspot.com',
  messagingSenderId: '123456'
})

I am guessing authDomain may have something to do with it, but if I change it to foobar.com I get the error:

 code: "auth/popup-closed-by-user", message: "The popup has been closed by the user before finalizing the operation."}

In short, is there a way I am missing to customize the oAuth url for Firebase?

Answer 1

I saw a lot of answers in Google OAuth 2 authorization - Error: redirect_uri_mismatch that pointed to the need to set up custom domains authorization, checking HTTP/S URI schemes, etc (I had followed most of them, including making sure my custom domain was authorized under Firebase Hosting, Firebase Authentication and even on the GCP Identity Platform "Authorized Domains" settings (https://console.cloud.google.com/customer-identity/settings?project=\<your-gcp-project-id>). That is, none of the linked answers seemed to be specific to Firebase Auth so here is my experience, FWIW:

The following Authorisation Error message was showing up on the "Sign in with Google" popup:

Error 400: redirect_uri_mismatch
The redirect URI in the request, https://<project-id>.firebaseapp.com/__/auth/handler, does not match the ones authorized for the OAuth client. To update the authorized redirect URIs, visit: https://console.developers.google.com/apis/credentials/oauthclient/${your_client_id}?project=${your_project_number}

After a lot of digging, I realized I needed to set the value of "Authorized redirect URIs" to https://<my-auth-subdomain>.mydomain.org/__/auth/handler, referencing my custom domain. See the below attachments.

It wasn't immediately obvious to me, but I also had to make the above settings on the OAuth 2.0 Client ID that was auto generated by Google Service. Following this related answer, I had initially created a new client ID that didn't end up making any difference.