Firebase Google Login does not ask for user passwords

Question

Firebase Google Login does not ask for user passwords and redirects to a wrong page.

The firebase email sign in does work.

I have set up the Authorised redirect URIs to the correct ones in the config JS code, in the firebase console and in the Google Cloud API key.

When I press the Google button it redirects to something like:

www.myurl.com/__/auth/handler?apiKey=xxxxxxxxxxxxxxxxxxxxx&appName=%5BDEFAULT%5D-firebaseui-temp&authType=signInViaRedirect&redirectUrl=https%3A%2F%2Fwww.myurl.com%2Fsign-in&v=9.13.0&providerId=google.com&scopes=profile

The code in my site is the following:

In the header:

<script src="https://www.gstatic.com/firebasejs/9.13.0/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.13.0/firebase-auth-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/ui/6.0.2/firebase-ui-auth.js"></script>
<link
      type="text/css"
      rel="stylesheet"
      href="https://www.gstatic.com/firebasejs/ui/6.0.2/firebase-ui-auth.css"
      />

in the body, I have an element with the following code:

<div id="firebaseui-auth-container"></div>

<script type="text/javascript">
      //const auth = firebase.auth();
      // FirebaseUI config.
      var uiConfig = {
        // Important: the following URL should be in both Firebase and Gloogle Cloud authorised clients
        signInSuccessUrl: "/private/main",
        // autoUpgradeAnonymousUsers: true,
        signInOptions: [
          // Leave the lines as is for the providers you want to offer your users.
          firebase.auth.GoogleAuthProvider.PROVIDER_ID,
          firebase.auth.EmailAuthProvider.PROVIDER_ID,

        ],
        // tosUrl and privacyPolicyUrl accept either url string or a callback.
        // Terms of service url/callback.
        tosUrl: "/terms-of-services",
        // Privacy policy url/callback.
        privacyPolicyUrl: "/privacy-policy"
      };
      // App's Firebase configuration
      const firebaseConfig = {
        apiKey: "xxxxxxxxxxxxxxxxxx",
        authDomain: "myurl.com",
        projectId: "xxxxxxxxxxxxxxxxx",
        storageBucket: "xxxxxxxxxxxxxxxx",
        messagingSenderId: "xxxxxxxxxxxxxxxxx",
        appId: "xxxxxxxxxxxxxxxxx",
      };

      // Initialize Firebase
      const app = firebase.initializeApp(firebaseConfig);

      // Initialize the FirebaseUI Widget using Firebase.
      var ui = new firebaseui.auth.AuthUI(firebase.auth());
      // The start method will wait until the DOM is loaded.
      ui.start("#firebaseui-auth-container", uiConfig);
    </script>

Maybe the user is already signed in with Google. Do you have an auth state observer that tells you if that's the case? — Doug Stevenson, Jan 10 '23 at 23:42
No, user is not logged in, I also has deleted my account on Firebase to make sure. — Escachator, Jan 11 '23 at 11:01

score 1 · Answer 1 · answered Jan 12 '23 at 06:17

There seems to be an issue with the syntax in element firebaseui-auth-container where the redirects are not getting called properly,which lands to an incorrect signIn page also as per your comment if the user is also already signedIn and you have verified it,then the redirects and rendering might cause this behavior.
I would suggest you remove the extra comma you have after the Email AuthProvider below;and check if the sign options work properly.

signInOptions: [ // Leave the lines as is for the providers you want to offer your users.    
  firebase.auth.GoogleAuthProvider.PROVIDER_ID,  
  firebase.auth.EmailAuthProvider.PROVIDER_ID]

Along with the above changes, try to add the following custom parameters if you wish to configure forced password re-entry every time the page is loaded for re authentication and singIn.

  signInOptions: [
{
      provider: firebase.auth.GoogleAuthProvider.PROVIDER_ID,
      scopes: [
        'public_profile',
        'email',
        'user_likes',
        'user_friends'
      ],
      customParameters: {
        // Forces password re-entry.
        auth_type: 'reauthenticate'
      }
    },

Also check the section for default redirect url on the sigIn success.

// Will use popup for IDP Providers sign-in flow instead of the default, redirect.
  signInFlow: 'popup',
  signInSuccessUrl: '<url-to-redirect-to-on-success>'

I would also recommend you to check below links for similar examples:

Thanks a lot Vaidehi. In the end turns out the solution was something else. I added it here in case it helps someone. — Escachator, Jan 13 '23 at 22:30

score 0 · Accepted Answer · answered Jan 13 '23 at 22:29

0

Turns out the solutions was to add to the Google Cloud API key the firebase authentication domain that appears in the firebaseConfig variable apart of the URL where the website doing the authentication is hosted.

answered Jan 13 '23 at 22:29

Escachator

1,742
1
16
32

Firebase Google Login does not ask for user passwords

2 Answers2