FirebaseUI-Angular
FirebaseUI-Angular copied to clipboard
window.firebaseUiInstance reset without callbacks when using auth emulator
I use Firebase Auth Emulator and found out that if there is no callback in the firebaseUiAuthConfig, I will get the following error if I rely on signInSuccessUrl to redirect the page to "home", then do nothing and simply sign out and be redirected back to the sign in page. After inspecting the code, it's because window.firebaseUiInstance is reset after firebaseui redirect.
core.mjs:7635 ERROR FirebaseError: Firebase: Auth instance has already been used to make a network call. Auth can no longer be configured to use the emulator. Try calling "connectAuthEmulator()" sooner. (auth/emulator-config-failed).
at createErrorInternal (index-909bd8f4.js:474:41)
at _assert (index-909bd8f4.js:480:15)
at Module.connectAuthEmulator (index-909bd8f4.js:2694:5)
at Auth.useEmulator (index.esm2017.js:694:9)
at new FirebaseuiAngularLibraryService (firebaseui-angular.mjs:21:22)
at Object.FirebaseuiAngularLibraryService_Factory [as factory] (firebaseui-angular.mjs:29:1)
at R3Injector.hydrate (core.mjs:6887:35)
at R3Injector.get (core.mjs:6775:33)
at ChainedInjector.get (core.mjs:13769:36)
at lookupTokenUsingModuleInjector (core.mjs:3293:39)
After stepping into the code, it is because window.firebaseUiInstance is reset to null after the redirection. Hence, this will trigger the recreation of firebaseUiInstance window.firebaseUiInstance = new firebaseui$1.auth.AuthUI(auth); However, this UI has already created in the Sign In page, we will get the error above.
However, if I define a callback in the firebaseui.auth.Config to do the redirection myself, window.firebaseUiInstance will be preserved and I can sign in and sign out without the error above.
callbacks: {
signInSuccessWithAuthResult: function (authResult) {
const router = AppInjector.get(Router);
router.navigate(['/']);
return false;
},
},