Expo Go搭配Firebase v9实现登录持久化失效问题求解

问题根因 #

你之前使用的初始化代码逻辑本身符合Firebase v9模块化API规范，initializeAuth方法在v9版本中真实存在，持久化不生效通常是三个原因导致的：

• 重复初始化Auth实例，后续调用无参getAuth()时拿到了未配置持久化的默认实例（默认用内存存储，杀进程就丢失数据）
• 混用v9模块化API和v8兼容层（firebase/compat/*）API，兼容层会创建独立的Auth实例覆盖持久化配置
• 应用启动时没有等待SDK从持久化存储恢复登录态，提前判断登录状态把用户导向登录页

分步实现方案 #

1. 全局唯一初始化Auth实例 #

单独抽离Firebase初始化文件，配置好持久化后直接导出auth实例，全局所有地方都用这个实例，不要重复初始化：

// firebaseConfig.js 统一初始化入口
import { initializeApp } from "firebase/app";
import { initializeAuth, getReactNativePersistence } from "firebase/auth";
import AsyncStorage from "@react-native-async-storage/async-storage";

// 替换为你自己的Firebase项目配置
const firebaseConfig = {};

const app = initializeApp(firebaseConfig);

// 初始化Auth并配置AsyncStorage持久化，这个实例全局唯一
export const auth = initializeAuth(app, {
  persistence: getReactNativePersistence(AsyncStorage)
});

注意：如果项目里之前引入过firebase/compat/auth相关代码，全部删除，不要同时使用兼容层API和模块化API操作Auth。

2. 修正注册/登录逻辑 #

所有Auth相关操作都导入上一步导出的配置好持久化的auth实例，不要调用无参getAuth()。另外createUserWithEmailAndPassword调用成功后SDK会自动完成登录，不需要重复调用signInWithEmailAndPassword，避免状态异常。修正后的注册流程代码如下：

// 导入全局唯一的auth实例
import { auth } from "./firebaseConfig";
import { createUserWithEmailAndPassword } from "firebase/auth";

const registerHandler = async (userData, password, oddsPreference, dispatch, onSuccess) => {
  try {
    await checkIsValidUsername(userData.username);
    await checkIsValidEmail(userData.email);
    await checkIsValidPassword(password);

    const result = await createUserWithEmailAndPassword(auth, userData.email, password);

    if (!result?.user?.uid) {
      dispatch({ type: 'error', payload: `账号创建失败：'${userData.email}'` });
      return;
    }

    console.log(`账号创建完成: ${result.user.uid} 对应邮箱 ${result.user.email}，用户名 ${userData.username}`);

    // 写入业务侧用户表
    await createUser({ ...userData, uid: result.user.uid, oddsPreference });

    // 创建账号后已自动登录，直接查询业务侧用户信息即可
    const user = await getUserByUid(result.user.uid);

    if (user === null) {
      dispatch({ type: 'error', payload: '登录失败!' });
    } else {
      dispatch({ 
        type: 'set_user', 
        payload: { 
          ...user, 
          username: user.username, 
          email: user.email,
          oddsPreference: user.oddsPreference 
        } 
      });
    }

    onSuccess();
  } catch (e) {
    dispatch({ type: 'error', payload: e.message });
  } finally {
    dispatch({ type: 'processing', payload: false });
  }
};

3. 应用启动时等待登录态恢复 #

在根组件用onAuthStateChanged监听Auth状态，SDK会自动从AsyncStorage读取之前保存的登录凭证完成恢复，等状态返回后再渲染应用路由，避免提前判断为未登录：

// App.js 根组件
import { useEffect, useState } from 'react';
import { View, ActivityIndicator } from 'react-native';
import { onAuthStateChanged } from 'firebase/auth';
import { auth } from './firebaseConfig';
import AuthContext from './authContext';

export default function App() {
  const [user, setUser] = useState(null);
  const [isAuthLoading, setIsAuthLoading] = useState(true);

  useEffect(() => {
    // 监听Auth状态变化，初始化时自动恢复持久化的登录态
    const unsubscribe = onAuthStateChanged(auth, async (firebaseUser) => {
      if (firebaseUser) {
        // 已恢复登录，拉取业务侧用户信息
        const businessUserData = await getUserByUid(firebaseUser.uid);
        setUser(businessUserData);
      } else {
        setUser(null);
      }
      setIsAuthLoading(false);
    });

    return () => unsubscribe();
  }, []);

  // 登录态恢复过程中显示加载页，不要直接渲染路由
  if (isAuthLoading) {
    return (
      <View style={{flex:1, justifyContent:'center', alignItems:'center'}}>
        <ActivityIndicator size="large" />
      </View>
    )
  }

  return (
    <AuthContext.Provider value={{user}}>
      {/* 你的应用路由、页面内容 */}
    </AuthContext.Provider>
  )
}

常见避坑点 #

• 所有Auth相关操作（登录、注册、登出、状态监听）都必须使用你通过initializeAuth创建的、配置了持久化的auth实例，无参调用getAuth()拿到的默认实例使用内存存储，杀进程后登录态必然丢失
• 不要手动操作AsyncStorage读写Firebase的登录凭证，SDK会自动完成持久化读写，手动操作反而会导致状态不一致
• 登出时调用signOut(auth)即可，SDK会自动清除持久化存储里的登录凭证
• 如果之前安装过旧版本代码，先卸载App重新安装，避免旧版本残留的存储数据导致配置不生效

内容的提问来源于stack exchange，提问作者at3374