Firebase：如何正确获取当前用户的认证状态？

你的问题核心在于Firebase Auth在页面刷新时需要异步恢复用户会话，直接同步读取auth.currentUser或全局uid变量时，Auth还未完成初始化与会话加载，因此会拿到null，导致登录状态判断失效。

现有方式不稳定的原因 #

• auth.currentUser是同步属性，但页面刷新后，Firebase需要从本地存储加载用户会话，这个过程是异步的。你在页面初始化阶段直接读取它，大概率还未完成加载，因此得到null。
• 全局uid变量虽通过onAuthStateChanged监听更新，但页面刷新后，该回调会在Auth初始化完成后才触发。若你在回调触发前就读取uid，同样会拿到初始的null值。

正确实现方案 #

1. 修复firebase.js中的代码错误

你漏掉了getAnalytics的导入，同时建议将Auth相关的导入移至顶部，避免变量提升问题：

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
import { getAuth, onAuthStateChanged } from "firebase/auth";

const firebaseConfig = {...};

// Initialize Firebase
export const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);

export const auth = getAuth(app);
export let uid = null;

onAuthStateChanged(auth, (user) => {
  if (user) {
    uid = user.uid;
  } else {
    uid = null;
  }
});

2. 通过onAuthStateChanged监听状态（推荐）

在需要判断登录状态的组件或函数中，不要同步读取auth.currentUser或uid，而是通过onAuthStateChanged监听，确保在用户状态确定后再执行逻辑：

import { auth } from "./firebase.js";

// 在组件初始化或业务逻辑中调用
onAuthStateChanged(auth, (user) => {
  if (user) {
    // 用户已登录，执行后续逻辑
    console.log("用户已登录，UID:", user.uid);
  } else {
    // 用户未登录，执行未登录分支逻辑
    console.log("用户未登录");
  }
});

3. 封装异步获取用户状态的函数（可选）

如果需要用async/await的方式获取用户状态，可以封装一个Promise：

// 在firebase.js中添加该函数
export const getCurrentUser = () => {
  return new Promise((resolve, reject) => {
    const unsubscribe = onAuthStateChanged(auth, (user) => {
      unsubscribe(); // 仅监听一次状态后取消订阅
      resolve(user);
    }, reject);
  });
};

在其他文件中使用：

import { getCurrentUser } from "./firebase.js";

async function checkLoginStatus() {
  const user = await getCurrentUser();
  if (user) {
    // 用户已登录逻辑
  } else {
    // 用户未登录逻辑
  }
}

// 调用检查函数
checkLoginStatus();

总结 #

永远不要依赖同步读取auth.currentUser判断登录状态，尤其是页面刷新场景下。必须通过onAuthStateChanged监听状态变化，或封装异步函数等待Auth完成会话加载，才能稳定获取用户的登录状态。

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