Firebase-js-sdk: This browser is not supported or 3rd party cookies and data may be disabled.

Created on 24 May 2018  路  7Comments  路  Source: firebase/firebase-js-sdk


[REQUIRED] Describe your environment

  • Operating System version: Windows 7
  • Firebase SDK version: 5.0.1
  • Firebase Product: auth
  • Browser: Chrome

[REQUIRED] **Login functionality is not working in chrome browser and giving the error message:

{code: "auth/web-storage-unsupported", message: "This browser is not supported or 3rd party cookies and data may be disabled."}

Relevant Code:

private oAuthSignIn(provider) {

    return this.afAuth.auth.signInWithPopup(provider)
      .then((credential) => this.saveUserInfo(credential.user))
      .catch(error => this.handleSignInError(error));
  }

signInWithGoogle() {

    const provider = new firebase.auth.GoogleAuthProvider();
    return this.oAuthSignIn(provider);
  }
auth

Most helpful comment

I had this issue because I used a custom domain. You have to correctly configure the domain, set it as authDomain and set correct redirect URLs in providers. You can see it in the firebase documentation:

image

https://firebase.google.com/docs/auth/web/google-signin?authuser=0

All 7 comments

Did you disable third-party cookie in your chrome settings?

Its disabled, by-default in my browser. It will happen with many other users and we cant ask every user to enable third-party cookie in their browsers. Because of this we will lose some user base.

Kindly let us know how to handle this scenario with any code changes that we can make.

The underlying communication protocol we use depend on this. We have no plans to support this right now.

If this is an issue for you, you can use 3P libraries to get the OAuth credential (for example google sign in library for JS supports this environment) and then sign in to Firebase using the obtained ID token or access token with signInWithCredential or signInAndRetrieveDataWithCredential.

I had this issue because I used a custom domain. You have to correctly configure the domain, set it as authDomain and set correct redirect URLs in providers. You can see it in the firebase documentation:

image

https://firebase.google.com/docs/auth/web/google-signin?authuser=0

This is unrelated to authDomain customization. There are many developers that customize their authDomain. This is the first we hear of any 3rd party cookie issues with this.
The issue may be manifesting due to some other problem in your setup.

@bpetetot you are right if I block only cookie of 1 (the origin), it will show this error
image

@bpetetot solution is perfect.
If your issue is on localhost you can comfortably disable third party cookies set by *.firebase.com.
If you are looking for a solution on your production environment. Then you need to follow steps provided by @bpetetot, which is also summarized here:
https://firebase.google.com/docs/auth/web/google-signin#customizing-the-redirect-domain-for-google-sign-in
Also you need to connect your firebase host to your custom domain (I am assuming your app is not hosted on firebase hosting and that is only why you are getting this issue.). Follow the steps here:
https://stackoverflow.com/questions/52218777/firebase-auth-customized-redirect-domain-prompts-neterr-cert-common-name-inv#answer-52309442

Good luck!
This issue is old, my post is help for others.

Was this page helpful?
0 / 5 - 0 ratings