Firebaseui-web: Enforce account selection on GoogleAuthProvider signInWithRedirect

Created on 26 Aug 2016  路  11Comments  路  Source: firebase/firebaseui-web

When I am logged in into the "Google Product" (gmail and such) with only one email address ([email protected]), that account is automatically used for Firebase.Auth. This is not OK.

I may be logged into Google only with [email protected], but may have another Google account [email protected] which I actually want to use with Firebase.

As soon as I'm logged into Google with two accounts, whenever I start a signInWithRedirect-process, I land on accounts.google.com (I have 3rd party Cookies disabled, if that matters), where I can choose one of the two accounts, but more importantly, I also get to add another account.

So, assuming I am logged into Google with [email protected] and [email protected], but I actually want to log into Firebase with [email protected], then I can choose to add the [email protected] account during the sign-in procedure, which is a very natural flow.

But if I'm only logged in with [email protected] and want to use [email protected] with Firebase, I need to go to www.google.com, select "Add Account" from the top-right "dropdown box", then go back to the application which is signing in, reload the page, redo a signInWithRedirect, select [email protected], which is the worst possible flow!

An "Add Account" should always be shown on accounts.google.com, at least it should be an option on the provider object.

This also applies to FirebaseUI, not just to the GoogleAuthProvider.

The Gitkit sign-in widget (window.google.identitytoolkit.start('#gitkitWidgetDiv', config);) handles this perfectly, it will ask for the email-address, then check if it needs to ask for a password, or authenticate via Google, and, if required, sends you to accounts.google.com for that specific Google account (which kindly also allows you to use another account if you want to, try that option to see how well that flow is implemented)

auth

Most helpful comment

This should be fixed in 2.1.1 release.
Check https://github.com/firebase/firebaseui-web#configure-oauth-providers
You can now pass customParameters for OAuth providers. This will accept the prompt field that Google OAuth supports.

All 11 comments

Hey Daniel thanks for filing the request. We understand your issue and it is an important one. In the Google Identity Toolkit, you had the option to specify the email from the beginning and then presented with the best option to login based on the email provided.
The trick here is that unlike GITKit, the firebaseui-web interface always starts with the provider sign in screen (sign in with google, sign in with facebook, etc). You are unable to figure out what email the user would want to login with.
The underlying problem is that firebase auth signInWithRedirect does not contain the ability to provide a login_hint.
The firebase auth team is interested in supporting similar Google OAuth parameter.
https://groups.google.com/forum/#!msg/firebase-talk/JKkVBmP2BOE/7wOpmyFSAgAJ;context-place=forum/firebase-talk
Once that is supported, we can explore supporting it in firebaseui-web.

Thanks for your feedback, I'm looking forward to the change.

I'll explain you my scenario. I'm a GITKit user who uses the Identity Toolkit to authenticate the user on a backend server. No other Google Services are involved. In the documentation for the Identity Toolkit there is a hint that users should migrate to Firebase. This is a move which I wholeheartedly welcome, because it will enable me to use Firebase's offerings in addition to what the backend provides (I was looking towards using AWS-Services for my needs, but Firebase covers them all).

So what I'm now trying to do is the following. Continue using GITKit, but then use the JWT (which I obtain from GITKit) not to authenticate the user, but to send this token to Firebase as a credential. This leaves me at

var credential = firebase.auth.GoogleAuthProvider.credential("{@@ gitkit_jwt @@}");
firebase.auth().signInWithCredential(credential).catch(function(error) {
  console.log("errorCode", error.code)
  console.log("errorMessage", error.message)
  console.log("email", error.email)
  console.log("credential", error.credential)
});

where {@@ gitkit_jwt @@} is the baked in JWT I'm getting via the gtoken cookie.

Now my problem is that I end up having this
errorCode auth/internal-error
errorMessage is_the_echoed_back_gitkit_jwt
email undefined
credential undefined

So I guess the GITKit JWT can't be used here, because it isn't implemented on the Firebase server. This would suit my needs 100%, because the GITKit widget is flawless. Yes, it's harder to set it up in the Google developer console, but this is already done, since this is a migration. I am not considering the use of the Google Plus sign-in as recommended in the Firebase Docs, as AdBlockers may be blocking the Button and it also relies on 3rd-Party cookies to be allowed (this is tricky to detect as a user!). The GITKit widget doesn't exhibit any of these flaws.

Should I eventually create a custom provider? Which are my possibilities here to use GITKit to authenticate into Firebase? How about you also accept a GITKit-tokens for authentication? This would be a good workaround until you have got the above issue fixed.

You can't use a GITKit id token to sign in to a Firebase google auth provider (that requires a Google OAuth id token or access token). You can't sign in a GITKit user to Firebase.
You will need to switch to firebaseui-web eventually.

I don't understand how adblockers would block the sign in with Google button.
3rd party cookies are allowed by default on browsers unless manually disabled by the user which would break a lot of services on the web.

If you have concerns on features that are not supported in firebaseui-web and were supported in GITKit, please let us know and we can address those.

@danielfaust We are working with the Google Sign-In team to address this concern. We hope it can be released in the next few months.

@alfongj This issue is almost a month old, in the meantime I've settled on the following, maybe it will give you some ideas.

First of all, it's totally awesome that GITKit and Firebase share the same user database when importing a Google Project into Firebase; that they continue sharing it even after importing the project. This gave me the flexibility I need to get this all working.

In the WebApp I'm still using GITKit, because the widget is absolutely flawless. It handles blocked third-party cookies perfectly (doesn't rely on them), and also doesn't require any widget which may be getting blocked by ad blockers. Now the WebApp signs in via GITKit, and once signed in, the server creates a sign-in token for Firebase which the WebApp then uses to sign in to Firebase via firebase.auth().signInWithCustomToken(value). New users can be created via GITKit and they appear in the Firebase database, which is absolutely wonderful. I hope that this stays like this forever.

I hope that one day I can skip this GITKit step, but as long as the Firebase widget isn't as good as GITKit's one, I hope that I can use GITKit to sign in.

Edit: BTW, this is only possible because the User ID in GITKit is the same as in Firebase. So I can generate a Firebase sign-in token for the User ID I'm obtaining during the GITKit sign-in process.

Any time frame of this feature being released?

Any update on this ?

This is a duplicate of this issue: https://github.com/firebase/firebaseui-web/issues/61
It's in the works. Sorry about the delay.

This should be fixed in 2.1.1 release.
Check https://github.com/firebase/firebaseui-web#configure-oauth-providers
You can now pass customParameters for OAuth providers. This will accept the prompt field that Google OAuth supports.

This issue should be reopened.

As I stated back in 2016, my solution was to continue using GITKit. Yesterday I upgraded some Firebase libraries from 4.9.0 to 5.8.6 and something happened, I don't known, maybe it triggered some upgrade procedure on Google's servers.

The point is that since yesterday I am now no longer able to sign in into a Google account with GITKit. When I enter (type in) my @gmail address which is registered as a "Google Sign-In" address in the Firebase Console (I see the Google logo on the side of the address), I am presented with a password prompt, instead of getting signed into the account automatically, since the browser is already signed into the Gmail account.

I managed to work around this issue by specifying displayMode: 'providerFirst', in the GITKit configuration, but this raised this entire issue again.

Let's assume that I am signed in with two accounts into Google and start my authentication flow, then I'm presented with the chooser from accounts.google.com, which is great. But now I go into Gmail and sign-out of my Google account, and re-sign-in with only one address. When I now start the authentication flow again, I am no longer presented the accounts.google.com chooser, but am signed in directly with the one email which is the only one signed into Gmail.

How is the user supposed to know that if he wants to use my app with the second Gmail account, that he first needs to log into his/her Gmail account, and then re-sign-in into my app in order to get the choice of which account to use with my app?


Go to https://fir-ui-demo-84a6c.firebaseapp.com which is the official Firebase Auth Demo app from the Firebase team ( https://github.com/firebase/firebaseui-web/tree/master/demo )

1) Log out of all the Google accounts, then sign into the Demo App by choosing "Sign in with Google"
2) accounts.google.com pops up and shows ALL the Google accounts which the browser is aware of.
3) Pick any one of those accounts to log into the Demo App, you need to enter your password, then you are signed in.
4) Now click "Sign Out" from the Demo App
5) Now click "Sign in with Google" in the Demo App. The last account is automatically signed in again. The user has NO way to pick another google account at this time.
6) Sign out again of the Demo App
7) Go to google.com and sign in into another Google account.
8) Go to the Demo App and click "Sign In with Google". Now I can finally choose which account I want to use to sign-in into the Demo App, even use another account.

This last thing, 8) this should ALWAYS be a configurable option in the Firebase SDK, that this screen is the default, even if the browser is signed into only one Google account. That the user is faced with the problem 5) is not acceptable.

Also, any idea why I can no longer use displayMode: 'emailFirst', in GITKit since yesterday with an account that got set up via Google Sign-In? When I then enter the password of my Google account (since I'm now presented with the password field), I get an Invalid Password message. Also, in the Firebase Console I am unable to trigger "Reset Password", I then get "An unknown error occurred while sending the password reset email". This error also occurs with password only accounts. I can trigger a Password Reset from the Android app, then an email is sent.


Oh, wait, I see, the Firebase SDK has the option to specify this prompt: 'select_account'. I will try to migrate my webapp to Firebase SDK now instead of GITKit.

Is there any chance to see this getting backported into GITKit?

This works as intended. If a user clicks the sign in with email option and enters an email, we will not show the google accountchooser and try to sign in the user with the specified email using Google. The user in that cases explicitly selected a specific email to sign in with and we will honor that. If you want to show the Google accountchooser, one option is to pass the prompt field.

Was this page helpful?
0 / 5 - 0 ratings