Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unable to sign-in as cross-site cookies are blocked #1070

Open
tommed opened this issue Feb 20, 2024 · 3 comments
Open

Unable to sign-in as cross-site cookies are blocked #1070

tommed opened this issue Feb 20, 2024 · 3 comments

Comments

@tommed
Copy link

tommed commented Feb 20, 2024

[REQUIRED] Describe your environment

  • Operating System version: dev: macOS, hosted: Debian on Cloud Run
  • Browser version: Chrome 121.0.6167.184
  • Firebase UI version: 6.1.0
  • Firebase SDK version: 10.8.0

[REQUIRED] Describe the problem

Related to this: https://goo.gle/3pcd-dev-issue

Steps to reproduce:

When attempting to sign-in via Google (though I suspect this will happen with any other provider), the redirect attempts to set cookies which are blocked, preventing the log-in process from working.

Relevant Code:

// init
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';

import * as firebaseui from 'firebaseui';
import ssoCfg from './sso.config.json'

// initialise firebase first
  firebase.initializeApp(ssoCfg.firebase);

  // then configure the sso ui
  uiConfig = {
    signInSuccessUrl: import.meta.env.PROD ? `https://${ssoCfg.firebase.authDomain}/` : `http://localhost:8080/`,
    signInOptions: [
      firebase.auth.GoogleAuthProvider.PROVIDER_ID
    ],
    credentialHelper: firebaseui.auth.CredentialHelper.GOOGLE_YOLO,
    callbacks: {
      signInSuccessWithAuthResult: function(authResult, redirectUrl) {
        console.log('CALLBACK:', JSON.stringify(authResult), redirectUrl)
        return true;
      }
    }
  };

  // Initialize the FirebaseUI Widget using Firebase.
  uiSingleton = new firebaseui.auth.AuthUI(firebase.auth());

then started like so:

uiSingleton.start(cssQuery, uiConfig);

Initial UI works:

image

but when clicked, you are signed in, redirected back to an error:

image

Set via: https://apis.google.com/js/api.js?onload=__iframefcb297111

image
@Boardtale
Copy link

Ugh, is this working at all for Safari or iOS browesers where third-party cookies are blocked completly? And firefox by default blocks them now?

@jhuleatt
Copy link
Collaborator

Here's a guide with best practices for using redirect sign-ins on browsers that block third-party cookies: https://firebase.google.com/docs/auth/web/redirect-best-practices. These should all work with FirebaseUI, but if they don't, please follow up in this issue.

@Boardtale
Copy link

Oh, so it's nothing new. I wonder if I could find it earlier somehow.
But thanks!
Currently change to popup, as it was kinda incident on my side. Just released the Firebase loging system instead the old one and people could nto log in via iOS.
popup works for now, but if popups are blocked, gonna need to adjust, so thanks! :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants