firebase / firebase-js-sdk

Firebase Javascript SDK
https://firebase.google.com/docs/web/setup
Other
4.74k stars 868 forks source link

Unable to process request due to missing initial state. #4256

Open chaitanya4288 opened 3 years ago

chaitanya4288 commented 3 years ago

[REQUIRED] Describe your environment

[REQUIRED] Describe the problem

When trying to do sign with redirect (social login: google/facebook), many of our users are getting the following error: Unable to process request due to missing initial state. This may happen if browser sessionStorage is inaccessible or accidentally cleared.

Steps to reproduce:

Not able to reproduce this. But it occurs very frequently for many of our users.

4e2fa850-d8cf-41d4-a066-764d0f63c135

google-oss-bot commented 3 years ago

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

Carlex300 commented 3 years ago

i have the same problem, heeeeeelp

NicholasHazen commented 3 years ago

Seeing the same issue in production for our react app on android.

dazzyjong commented 3 years ago

same issue on the Facebook in-app browser while the user does Facebook sign-in.

Hamaad-Siddiqui commented 3 years ago

Seeing same issue on Android using Next.js & Firebase v8.2.1

atulgpt commented 3 years ago

+1

AndresMWeber commented 3 years ago

Seeing the same consistently on Android + Chrome deployed on Vercel with Next.JS & Firebase v8.2.1 both using signInWithPopup and signInWithRedirect. Worth noting that this functions as intended in Android + Firefox.

Gobbees commented 3 years ago

+1 on NextJS using Firebase v8.2.2

juergengunz commented 3 years ago

+1

sthielen commented 3 years ago

+1 - anyone managed to resolve?

kenji7157 commented 3 years ago

this issue, the version doesn't matter.

If you are using a custom domain, you have to set Client SDK configuration. you set it?

firebase.initializeApp({
  apiKey: '...',
  // Replace the default one with your custom domain.
  // authDomain: '[YOUR_APP]/firebaseapp.com',
  authDomain: 'auth.[YOUR_DOMAIN]'
});

https://cloud.google.com/identity-platform/docs/show-custom-domain

KevinLourd commented 3 years ago

@kenji7157 I have the same issue on the Facebook in-app browser while the user does Facebook sign-in. I am not using a custom domain

jaredtbrown commented 3 years ago

I am having the same error using the GitHub auth provider when using my Android device + Chrome. I have tried using the signInWithRedirect and signInWithPopUp methods and tried using the FirebaseAuthUI but all returned the same result.

Using the same Android device and Firefox, however, works just fine.

raevilman commented 3 years ago

I was using GitHub auth provider with custom domain configured on Netlify as CNAME. Although GitHub configuration in firebase console tells me to use the default redirect URL(eg. abc-989d.firebaseapp.com) not the custom one I had created. But that was causing the error in question.

Once I updated my GitHub OAuth application with the new custom URL everything worked fine.

Eg: https://auth.custom-domain.com/__/auth/handler this is what I've set in app configuration on GitHub.

KevinLourd commented 3 years ago

@raevilman I moved to custom domain and I still have same issue. Althought I am not using Github as DNS provider but gandi.net

raevilman commented 3 years ago

@KevinLourd For context: I was trying to change domain name shown on Google sign-in consent page. And I am using Netlify as hosting provider, GitHub as OAuth. I've documented the steps here

~HIH

louisameline commented 3 years ago

Same here. Using cordova wkwebview, inappbrowser, a well configured custom auth domain. I've seen it happen more on iOS than Android.

What is weird is that the second time I try to sign in with Facebook (when I don't have to enter my credentials anymore), it works fine. When it's with AppleId (which asks me my credentials every time), the second time fails with the same result.

Edit: now it seems that it doesn't always work the second time with Facebook, it has an inconsistent behaviour.

jaredtbrown commented 3 years ago

I have now pointed the auth domain to point to the auth.custom-domain.com domain I have created but still the same error for Android + Chrome.

louisameline commented 3 years ago

Anyone at Firebase looking into this? If our users can't log into our apps, it should be priority #1 no?

KevinLourd commented 3 years ago

@louisameline I have contacted the Firebase few days ago, but they asked for a minimum reproductible example. Would anyone have reproduced one by any chance? cc @hsubox76

louisameline commented 3 years ago

I guess I can share a piece of my app if it stays private. Let me work something out

Hamaad-Siddiqui commented 3 years ago

@KevinLourd I have a project ( still in development ) which is getting the same issue. Here is the repo : https://github.com/Hamaad-Siddiqui/Fast-Feedback-2.0

sam-gc commented 3 years ago

Hi folks-- for those of you who've been able to reproduce it yourselves, what are the circumstances specifically? For example, are the browsers running in private/incognito mode? Are third-party cookies disabled (this shouldn't apply but in some cases the way this is implemented in the browser could cause issues)?

sam-gc commented 3 years ago

One more thought since this issue could be caused by numerous things.

There was a recent bug in the Firebase Console that caused the wrong auth domain to be presented when enabling other OAuth providers. The domain had "-default-rtdb" at the end and this would lead to the wrong configuration with the other provider. Since the "missing initial state" issue could be caused by several different things, it would be worth double checking your configuration for GitHub/Microsoft/etc sign in. The bug in the Console was resolved late December and it now displays the correct value, but depending when you looked at the Console to configure the providers you may still have issues.

sthielen commented 3 years ago

@samhorlbeck I've unfortunately not been able to reproduce it consistently, but from the reports I have seen it appears to be happening inside the Instagram WebView on iOS when trying to sign in with Facebook or Google. This happens if someone links to our site in their Instagram bio, where tapping that link doesn't intent to another browser but opens Instagram's in-app, webview-based browser.

Based on that, it feels like it might have something to do with these apps' implementations of UIWebView or WKWebView? Though I can verify that sessionStorage/localStorage both work as expected in those browsers, so it's possible that's a red herring. Let me know if I can help in any other ways, and I'll see if I can find anyone who can reliably reproduce it. Thanks!

Hamaad-Siddiqui commented 3 years ago

@samhorlbeck Just go on a mobile to the website that I provided you the repo of https://fast-feedback-dev.vercel.app And click on Sign In with GitHub. The error will happen every time you go from Chrome it doesn't seem to occur on Firefox so it seems to me maybe there is something wrong with chrome ? I am specifically talking about the mobile versions...

louisameline commented 3 years ago

I saw it happen only once in my Android hybrid app, but it's pretty much systematic in iOS (either a real device or the emulator). For starters, I can give you access to my app in Testflight if you want to see if it happens to you too, I just need an email address.

<widget id="io.xxxxx.www" version="0.1.75" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>My app</name>
    <access origin="https://*.google.com" />
    <access origin="https://*.google-analytics.com" />
    <access origin="https://*.googleapis.com" />
    <access origin="http://*.googletagmanager.com" />
    <access origin="https://*.googletagmanager.com" />
    <access origin="https://*.gstatic.com" />
    <access origin="https://api.ipify.org" />
    <access origin="https://*.xxxxx.io" />
    <allow-intent href="https://*.xxxxx.io/*" />
    <allow-intent href="mailto:*" />
    <allow-navigation href="about:*" />
    <feature name="CDVWKWebViewEngine">
        <param name="ios-package" value="CDVWKWebViewEngine" />
    </feature>
    <platform name="android">
        <allow-intent href="market:*" />
        <preference name="AndroidLaunchMode" value="singleTask" />
        <preference name="android-minSdkVersion" value="19" />
        <preference name="android-targetSdkVersion" value="29" />
        <preference name="StatusBarBackgroundColor" value="#6f52d8" />
        <preference name="StatusBarOverlaysWebView" value="false" />
        <preference name="StatusBarStyle" value="lightcontent" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <preference name="deployment-target" value="13.4" />
        <preference name="StatusBarOverlaysWebView" value="true" />
        <preference name="StatusBarStyle" value="darkcontent" />
        <preference name="WKWebViewOnly" value="true" />
    </platform>
    <plugin name="cordova-plugin-compat" spec="^1.2.0" />
    <plugin name="cordova-plugin-deeplinks" spec="^1.1.1" />
    <plugin name="cordova-plugin-device" spec="^2.0.3" />
    <plugin name="cordova-plugin-file" spec="^6.0.2" />
    <plugin name="cordova-plugin-purchase" spec="^10.5.3" />
    <plugin name="cordova-plugin-itunesfilesharing" spec="^0.0.2" />
    <plugin name="cordova-plugin-splashscreen" spec="^5.0.2" />
    <plugin name="cordova-plugin-statusbar" spec="^2.4.3" />
    <plugin name="cordova-plugin-whitelist" spec="1" />
    <preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
    <universal-links>
        <host name="link.xxxxx.io" scheme="https" />
        <host name="auth.xxxxx.io" scheme="https">
            <path url="/__/auth/callback" />
        </host>
    </universal-links>
    <engine name="android" spec="^8.1.0" />
</widget>
    "dependencies": {
        "cordova-android": "^8.1.0",
        "cordova-ios": "^6.1.1",
        "cordova-plugin-browsertab": "^0.2.0",
        "cordova-plugin-buildinfo": "^4.0.0",
        "cordova-plugin-compat": "^1.2.0",
        "cordova-plugin-customurlscheme": "^5.0.2",
        "cordova-plugin-deeplinks": "^1.1.1",
        "cordova-plugin-device": "^2.0.3",
        "cordova-plugin-file": "^6.0.2",
        "cordova-plugin-inappbrowser": "^4.1.0",
        "cordova-plugin-itunesfilesharing": "^0.0.2",
        "cordova-plugin-network-information": "^2.0.2",
        "cordova-plugin-purchase": "^10.5.3",
        "cordova-plugin-splashscreen": "^6.0.0",
        "cordova-plugin-statusbar": "^2.4.3",
        "cordova-plugin-whitelist": "^1.3.4",
        "cordova-plugin-wkwebview-engine": "^1.2.1"
    }
kaidohTips commented 3 years ago

+1

sam-gc commented 3 years ago

@Hamaad-Siddiqui your app works consistently for me on Android / Chrome using GitHub sign in

louisameline commented 3 years ago

@samhorlbeck Ready to test mine? Let's have you test it in Testflight if you will and if you see it I'll share code with you.

sam-gc commented 3 years ago

@louisameline unfortunately I don't have access to an iOS device so it's going to take me a bit more time to try to reproduce there. I'm seeing what I can do

Ogaie commented 3 years ago

I had same issue. However I resolve.

before "firebase.auth().signInWithPopup(provider)" I checked "firebase.auth().currentUser".

if currentUser is not null I think we can get the error after "signInWithPopup"

—— var user = firebase.auth().currentUser;

if (user) {
  console.log("logined:");
} else {

firebase .auth() .signInWithPopup(provider) .then((result) => {~

}

——

You need to login again, you should logout before do it.

—-

firebase.auth().signOut().then(() => { // Sign-out successful.

  }).catch((error) => {
    // An error happened.
  });

——

hope try this

ShahriyarR commented 3 years ago

Same issue with Ubuntu 18.04, Firefox 84.0.2 (64-bit) with Facebook SignIn. Even after logging out the problem still persists. Surprisingly there is no such issue with Chrome... [Update] - it worked with the incognito mode in Firefox as well. One possible issue:

[Final Update] It turned out that in Firefox there is a default extension/addon called Facebook Container. I have disabled it and it worked, with no aforementioned error.

jaredtbrown commented 3 years ago

Here is a link to how I am implementing login with GitHub: https://www.github.com/jaredtbrown/github-dash/tree/main/src%2Fcontainers%2FLogin%2FLogin.js

Here is a link to my app to see the behavior: https://githubdash.com/login

I can consistently recreate this bug on my Android device and Chrome. However, I just tested on the same device in an incognito tab and it worked fine.

y-yudai commented 3 years ago

same issue on iOS safari using Next.js v10.0.5 & Firebase v8.2.3 with Google SignIn.

louisameline commented 3 years ago

Let me ask respectfully, how many reports do we need until this is handled seriously by Firebase? So far I've seen only one Google dev who doesn't even have an iOS device to test what I'm willing to share. Can't your employer provide you with a remote machine? Has all the team tried to login? Can I offer to share my screen? It's almost been a month.

I'm sorry to complain but how I am supposed to trust Firebase's reliability when a critical feature doesn't get fixed when it's broken. This is disappointing.

jgillick commented 3 years ago

+1 Android phone auth, react native & @react-native-firebase/auth module. It works fine for iOS, however, we just launched Android and many of our users are entirely blocked by this.

Feiyang1 commented 3 years ago

@louisameline Can you invite me to your app in testflight? You can find my email in my profile.

sam-gc commented 3 years ago

I have another question for debugging. When this occurs, does the app ever successfully reach the sign in provider (Google/GitHub/etc)? Or does the app reach this state without ever getting there?

Edit, question 2: does the message appear on its own or only after a refresh? I can sort of reproduce this in an Android WebView but only after the page is refreshed. So in my case these are the steps:

  1. Initiate log in flow (can be sign in or popup)
  2. Complete provider sign in. Sometimes there's the consent screen, sometimes not (this should not matter)
  3. Subsequently a blank page is shown
  4. User refreshes, the "missing initial state" message is displayed.

Can anyone confirm whether or not this is the same process they're seeing when reproducing? If not, how does your reproduction differ?

louisameline commented 3 years ago

1) I do reach the provider and log in with my credentials. It's when I am redirected back to my auth domain that I see the message.

NOTE: I do not see the message when I am already logged in at the 3rd party provider, the whole process then takes 2s and succeeds. Only when I need to take some time to fill in fields do I see the issue.

2) The blank page you see might be issue #2103, that's something else - but also annoying! You have the blank page but the process actually succeeded I think.

I think it's normal that you have the error after a refresh, because the token has already been used or something like that (I am not an oAuth expert though). I think this does not correspond to the bug of this thread, which we get without any user-generated refresh (we don't do anything except logging in normally to our 3rd party provider).

Note: I have sent an invite to Feiyang to my iOS app on Testflight.

amrdraz commented 3 years ago

We have this problem occuring when we're doing phone verification i our react native app sometimes when sending SMS users get directed to a captcha web view. and sometimes that webview shows the above

jaredtbrown commented 3 years ago

@samhorlbeck My reproduction steps follow more closely with @louisameline.

  1. The user initiates the login flow and successfully logs in with the provider
  2. The user is redirected back to the app and is shown the error message

No blank screen. No refresh required.

jgillick commented 3 years ago

We're having the same issue as @amrdraz.

Steps to reproduce:

Some users were able to try again and get through, most others cannot get past the error.

FullSiliconAlchemist commented 3 years ago

I'm able to reproduce this by sign-in from a link that was shared, particularly Instagram. In this case, the link is shared as an Instagram message of this format: https://appname.app then when I proceed to doing the regular log-in flow (successful Google sign-in via popup window) I am met with a blank page and when opening the page in chrome, I get the same error message as shown above.

I suspect it's a caching issue in the parent app (Instagram in this case), but no solution or real understanding of it yet.

Hope this helps!

Feiyang1 commented 3 years ago

@louisameline Thanks for the invite. I tested a few times and kept getting redirected to a blank page, but no error message. Here is what I did:

  1. Install the app
  2. Login with Google
  3. Enter credential to Google
  4. Got redirected to a blank page after a couple seconds

In order to do step 3 (you mentioned it is an important step), I deleted and reinstalled the app before each test. I did 4 tests in total, got redirected to a blank page 3 times and back to the app correctly once.

I'm using an iPhone 11 Pro with iOS 14.3. What device and iOS version do you use for testing?

louisameline commented 3 years ago

I use an iPhone Xs with iOS 14.3. But today it's much harder to reproduce the bug than the other day.

I tested all 5 providers (google, facebook, twitter, github, apple) with the app installed app on the real device, then with the app launched from Xcode on the real device, then in the emulator only. Out of roughly 15 login attempts, I got the "missing initial state" message only once (with Google with the app installed), while it was almost systematic the other day.

hmazer commented 3 years ago

I can only reproduce this error inside Instagram's WebView for iOS (like when you send a link on instagrams chat). Its either this message or some variation of it. Sometimes it says it lost connection with the popup, other times the screen goes completely blank after login and nothing else happens.

vamsi-manyam commented 3 years ago

@louisameline I have contacted the Firebase few days ago, but they asked for a minimum reproductible example. Would anyone have reproduced one by any chance? cc @hsubox76

Im facing the same issue for the google/facebook signing in my website You can have a look at it : https://wattamovie.vercel.app/

Steps to get that error 1) open the link in Instagram in app browser ( by pasting the message in any dm and then clicking it) 2) Login/Signup Via google 3) Then you get that error

IT would be great if you shared the solution with the community (if you had one)

vamsi-manyam commented 3 years ago

I had same issue. However I resolve.

before "firebase.auth().signInWithPopup(provider)" I checked "firebase.auth().currentUser".

if currentUser is not null I think we can get the error after "signInWithPopup"

—— var user = firebase.auth().currentUser;

if (user) {
  console.log("logined:");
} else {

firebase .auth() .signInWithPopup(provider) .then((result) => {~

}

——

You need to login again, you should logout before do it.

—-

firebase.auth().signOut().then(() => { // Sign-out successful.

  }).catch((error) => {
    // An error happened.
  });

——

hope try this

Were you having the same issue as mine? Im facing the same issue for the google/facebook signing in my website You can have a look at it : https://wattamovie.vercel.app/

Steps to get that error

open the link in Instagram in app browser ( by pasting the message in any dm and then clicking it) Login/Signup Via google Then you get that error

vamsi-manyam commented 3 years ago

[REQUIRED] Describe your environment

  • Windows 10, Android 10
  • Google chrome
  • firebase js sdk version: 7.24.0
  • firebase auth

[REQUIRED] Describe the problem

When trying to do sign with redirect (social login: google/facebook), many of our users are getting the following error: Unable to process request due to missing initial state. This may happen if browser sessionStorage is inaccessible or accidentally cleared.

Steps to reproduce:

Not able to reproduce this. But it occurs very frequently for many of our users.

4e2fa850-d8cf-41d4-a066-764d0f63c135

Hey @chaitanya4288 did you find any solution for this?