firebase / firebaseui-web

FirebaseUI is an open-source JavaScript library for Web that provides simple, customizable UI bindings on top of Firebase SDKs to eliminate boilerplate code and promote best practices.
https://firebase.google.com/
Apache License 2.0
4.58k stars 1.06k forks source link

Sign in flow get into an infinite loop sometimes #1009

Closed Typogram closed 1 year ago

Typogram commented 1 year ago

[REQUIRED] Describe your environment

[REQUIRED] Describe the problem

Sometimes, the login flow will get stuck into a infinite loop, sign-in page -> select google account -> sign-in page -> select google account -> sign-in page -> ...

Steps to reproduce:

I haven't found a way to reproduce this reliably. I have recorded a video when I reproduce the bug: https://s3.us-west-2.amazonaws.com/secure.notion-static.com/9c18108e-31a9-431a-a830-dc3c0af1b523/login-loop.mp4?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIAT73L2G45EIPT3X45%2F20230220%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20230220T201701Z&X-Amz-Expires=86400&X-Amz-Signature=49daae6d419baf40f08fb2496b352666006b1bbc55ebae2841d88655034822dd&X-Amz-SignedHeaders=host&response-content-disposition=filename%3D%22login-loop.mp4%22&x-id=GetObject The first attempt was successful and landed onto the account page as planned, but then I log out and try login in again several times and all failed and stuck in the infinite loop

Relevant Code:

firebase.initializeApp(firebaseConfig);

var uiConfig = {
    callbacks: {
        signInSuccessWithAuthResult: function(authResult, redirectUrl) {
            // User successfully signed in.
            // Return type determines whether we continue the redirect automatically
            // or whether we leave that to developer to handle.
            return true;
        }
    },
    signInSuccessUrl: "/account",
    signInOptions: [
        // Leave the lines as is for the providers you want to offer your users.
        firebase.auth.GoogleAuthProvider.PROVIDER_ID,
        firebase.auth.EmailAuthProvider.PROVIDER_ID,
    ],
};
// Initialize the FirebaseUI Widget using Firebase.
var ui = new firebaseui.auth.AuthUI(firebase.auth());
// The start method will wait until the DOM is loaded.
ui.start("#firebaseui-auth-container", uiConfig);
adamjack commented 1 year ago

I got that, and eventually I received a helpful message from Firebase pointing me here:

https://firebase.google.com/docs/auth/web/redirect-best-practices

... the gist of my problem was iOS/Safari/Firefox were disallowing some third party cookies, so the login couldn't mark it's progress, so looped. Not sure if this is your problem or not.

rachelmyers commented 1 year ago

This seems solved by following the redirect best practices linked above. Please comment if it's not resolved.