firebasegoogle-cloud-platformfirebase-authentication

How do I add website domain to firebase google authentication to show on sign in?

Can someone explain to me how to add custom domain to firebase google auth? I have added it in Authorised domain but its not showing? Do I need to make a code change for it too? It is a nextjs website. I want it to be shown instead of firebase.app during sign in.

Sreenshot

Solution

  • I finally figured out the approach.

    1. So first you have to make a SUBDOMAIN for your website and add it to Firebase hosting. It will show you the steps to add it to your domain DNS records. You can have it like auth.domain.com
      You don't need to host your site there. Mine was being hosted on some other platform too. It's just to host the auth screen I guess.

    2. Then you have to go to google cloud console -> google auth platform -> client ID

      enter image description here

    3. Then in the authorised JavaScript origins enter your domain and subdomain

    4. In the Authorised redirect URIs enter auth.domain.com/__/auth/handler with HTTPS
      Here auth is the subdomain that I chose, you can choose any.

    5. Then in your website in the env variable for FIREBASE_AUTH_DOMAIN enter auth.domain.com

    6. Add your website info in Branding section. Thats what will appear on the login screen.

    Idk why all this is not mentioned in the docs anywhere. Maybe its mentioned but very hard to find. Hopefully it helps someone. Note: I am using sign in with popup. Not sure if it works the same way with redirect.