Menu
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?
706
To customize your Firebase project's email action handler, you must create and host a web page that uses the Firebase JavaScript SDK to verify the request's validity and complete the request. Then, you must customize your Firebase project's email templates to link to your custom action handler.
To the right side of page click on the edit icon (pen), which opens the configuration page. Under "Authorized JavaScript origins", you should see your yourFirebaseApp.firebaseapp.com domain. Click "+ Add URI" and add your custom URI. This should be an "https" domain, so use https://myApp.com.
By configuring custom domains for authentication emails, users will see the same domain for your web address and the user management emails. There are broadly two steps to setting this up: Add the domain to your email templates in the Firebase console. Verify your domain by adding DNS records in your domain registar.
Alternatively, you could set up a custom domain for Firebase Hosting on a subdomain of your domain e.g. auth.foobar.com and you'd then be able to use auth.foobar.com as your authDomain. There is currently no support for using a non-Firebase-Hosting domain as your authDomain.
If requested in the Connect Domainsetup wizard, verify your apex domain. These steps ensure that your domain is not already linked with a Firebase project and that you own the specified domain. In your domain provider's site, locate the DNS management page. Add and save a new record with the following inputs: Type: Add a TXT record.
Needs Re-Verification Firebase may require you to manually re-verify your domain ownership if any of the following situations happen: The TXT record added when you initially verified your domain ownershipwas altered or removed from your domain's DNS settings.
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.
155
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
