如何在 nextjs 頁面中檢查身份驗證狀態

Question

我不明白為什么在下面的情況下調用auth.currentUser總是返回 null。 我有另一個組件可以偵聽 auth 狀態並識別用戶已登錄（這是正確的）。

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

type Props = {
  hiProp: string;
};

const Index = ({ hiProp }: Props) => {
  useEffect(() => { 
    if (auth.currentUser) { // this never resolves to true
      const router = useRouter();
      router.push("/home");
    }
  }, []);

  return <div>{hiProp}</div>
}

export default Index;

export const getStaticProps = async () => {
  const hiProp = await getHiProp();

  return {
    props: { hiProp },
  };
};

Answer 1

當不確定是否有用戶登錄時， currentUser屬性被記錄為 null。當網頁最初加載時，它最初總是為 null - 它不會預先填充以前登錄的用戶對象。您必須使用身份驗證狀態觀察器來確定用戶對象何時首次可用，正如您所說的其他代碼正在執行的操作。

確定登錄用戶需要不確定的時間。 您可以在這篇博客文章中閱讀更多相關信息，該文章描述了為什么 currentUser 意外為 null 。