应用离线时 Firebase 身份验证挂起

Question

我有一个 Web 应用程序使用 Firebase SDK 9.20.0 的 Firebase 身份验证部分和 FirebaseUI 6.0.2.

当互联网良好时，一切都按预期进行：用户可以登录并且启用持久性，他们在离开应用程序后重新登录时不需要再次输入凭据。

但是当连接不好时，重新登录将花费很长时间，这就像应用程序等待超时发生才让用户进入。

有没有办法减少或绕过这个超时？

这是我用来初始化 Firebase Auth 和 FIrebase UI 的代码

// Firebase core
import firebase from "firebase/compat/app";
const firebaseapp = firebase.initializeApp({
  apiKey, authDomain, databaseURL, projectId, storageBucket, messagingSenderId, appId, measurementId
});

// App-check
import { initializeAppCheck, ReCaptchaV3Provider } from "firebase/app-check";
initializeAppCheck(firebaseapp, {
  provider: new ReCaptchaV3Provider(process.env.VUE_APP_reCAPTCHAPublicKey),

  // Optional argument. If true, the SDK automatically refreshes App Check tokens as needed.
  isTokenAutoRefreshEnabled: true
});

// Auth + FirebaseUI
import { getAuth, EmailAuthProvider } from "firebase/auth";
import * as firebaseui from 'firebaseui';
const auth = getAuth(firebaseapp);
const b_ui = new firebaseui.auth.AuthUI(auth);
const b_uiConfig = {
    signInSuccessUrl: '',
    signInOptions: [ { provider: EmailAuthProvider.PROVIDER_ID } ],
    'credentialHelper': firebaseui.auth.CredentialHelper.NONE //to avoid showing credentialhelper
};
b_ui.start("#firebaseui-auth-container", b_uiConfig);

// Firestore + persistence
import "firebase/compat/firestore";
const b_db = firebase.firestore();
b_db.enablePersistence({synchronizeTabs: true})
.catch(error => console.error('core.enablePersistence - fail to enable firestore persistence', error));

Answer 1

您正在为 Firestore 启用持久性，但不为 Firebase 身份验证启用。您可以通过添加 setPersistence() 方法为 Firebase 身份验证启用持久性。

通过添加带有 firebase.auth.Auth.Persistence.LOCAL 参数的 auth.setPersistence() 方法，您告诉 Firebase 在设备本地存储用户的身份验证状态。这意味着即使用户关闭应用程序并稍后重新打开它，他们的身份验证状态仍将保留并且他们不需要再次登录。

添加以下行：

// Enable persistence for Firebase authentication
auth.setPersistence(firebase.auth.Auth.Persistence.LOCAL);

之前：

b_ui.start("#firebaseui-auth-container", b_uiConfig);