[TOKEN_EXPIRED] App loses auth state on user registration and page refresh

[priyath]

Describe your environment

• Operating System version: macOS Big Sur Version 11.4
• Browser version: Google Chrome Version 100.0.4896.127 (Official Build) (arm64)
• Firebase SDK version: 9.6.11
• Firebase Product: auth

Describe the problem

When a new user (email is not yet registered with firebase authentication) signs in using Google Login, and the app
is refreshed immediately after (approx 10 seconds), the authenticated state is lost. On closer inspection, it was identified that a network call initiated by the firebase SDK upon page refresh (https://identitytoolkit.googleapis.com/v1/accounts:lookup?key=) errors out with a 400 TOKEN_EXPIRED error message.

{
  "error": {
    "code": 400,
    "message": "TOKEN_EXPIRED",
    "errors": [
      {
        "message": "TOKEN_EXPIRED",
        "domain": "global",
        "reason": "invalid"
      }
    ]
  }
}

Steps to reproduce:

A basic working example of this can be found at https://github.com/priyath/firebase-auth-issue

1. Checkout the above repository
2. Update firebase.js file with your project's firebase credentials
3. Run the application using yarn start
4. Open the browser console and click on Sign Up. Sign Up using credentials of an account that is not yet registered with your firebase project.
5. Observe both the console and the network tab.

Observations:

Upon successful login (and register) The auth state changed log will fire with the User object.
After 10 seconds, a page refresh will be triggered, after which the auth state changed log will be null.
If you inspect the network tab, the request to https://identitytoolkit.googleapis.com/v1/accounts:lookup?key= will show a 400 TOKEN_EXPIRED error.

[sam-gc]

Hi @priyath, we haven't been able to reproduce this on our end. Would you mind checking the indexedDB store in dev tools to see if you can find the persisted user? (Note, unlike local storage dev tool you'll need to manually click the refresh icon in the DB viewer).

Another thing that could help us identify the issue -- could you try to insert a hard token refresh 10 seconds after login (i.e. instead of refreshing the page, call user.getIdToken(/*forceRefresh*/ true))

[google-oss-bot]

Hey @priyath. We need more information to resolve this issue but there hasn't been an update in 5 weekdays. I'm marking the issue as stale and if there are no new updates in the next 5 days I will close it automatically.

If you have more information that will help us get to the bottom of this, just add a comment!

[Paul-Todd]

I am also seeing a very similar issue with 9.7.0 (but also in 9.8.0)

this works:
this.firebase = initializeApp(firebaseConfig); this.auth = getAuth(this.firebase);

but this does not
this.firebase = initializeApp(firebaseConfig); this.auth = initializeAuth(this.firebase, { errorMap: debugErrorMap });

Right now I have rolled back to the old code until I have more chance to look at what is going wrong - no errors and no changes in the execution flow were noted in my app.

I also did the tokenRefresh result to no effect

[sam-gc]

@Paul-Todd, the issue with the second example is that you're not providing any persistence type in the options map. getAuth() includes a bunch of automatic dependencies (like multiple types of persistence), whereas initializeAuth allows you to tweak your dependencies (but that means you need to explicitly include a persistence field, or else Auth defaults to in-memory).

Please see https://firebase.google.com/docs/auth/web/custom-dependencies for more information about getAuth vs initializeAuth.

The problem in this issue is different, I believe, so @priyath please respond to the questions in #6175 (comment) when you get the chance.

[priyath]

@sam-gc apologies for the delay!

Immediately after sign up the indexDB has the following entry:

After a 10 second page refresh: (this can even be a manual refresh after a few seconds has elapsed as well.)

With user.getIdToken(/*forceRefresh*/ true))

If I immediately perform user.getIdToken(/*forceRefresh*/ true)) after sign up, the token refreshes successfully and works as expected.

However, if I delay this by a few seconds (~ 10 seconds), the token refresh results in a token expired API response.

It seems like the initial token received right after registration has a very very short expiration time.

I wonder if there could be something in my firebase project that is causing this behavior?

If not, I can also go with a forced refresh immediately after user registration which seems like a possible workaround for this problem, although it would still be bit of a race condition between token expiration and the token refresh events.

[kefniark]

I run into a really similar issue, some of my users complained about having to login twice.

I found out during the first login (user creation), the token I get from firebase seem to have indeed a really short lifetime
And at one of the first query to my backend, it get refused (less than 2-3s after login)

// this throw an error with `FirebaseAuthError: Firebase ID token has expired. `
await firebase.auth().verifyIdToken(token)

What I noticed:

• It only seem to happen for me when a user is created on firebase side, the first time. Any later login go through as expected.
• I can reproduce the issue consistently by going to firebase admin, delete the user account, login with that user again
• In my case, I suspect it to be related to firebase.auth().setCustomUserClaims() usage

Possible workaround:

• Adding a delay setTimeout(login, 500) on the frontend is enough for auth.currentUser?.getIdToken() to become valid, but this is ugly and doesn't feel reliable
• Forcing a frontend token refresh just after user creation await auth.currentUser?.getIdTokenResult(true) like you suggested in your previous comment

I hope this may help you