Firebase当前用户未在NextJS中保持状态

sshcrbum  于 2023-08-04  发布在  其他
关注(0)|答案(1)|浏览(74)

我正在使用firebase和nextjs制作一个应用程序,当我登录并尝试获取当前用户时,我创建了一个登录页面。这个问题开始于我几天前在react native中也是第一次它保持状态,在firebase从9.2.0更新到10.0.0之后,用户没有保持状态。
Nextjs代码:
AuthConext.js:

import React from "react";
import { onAuthStateChanged, getAuth } from "firebase/auth";
import firebase_app from "@/firebase/config";

const auth = getAuth(firebase_app);

export const AuthContext = React.createContext({});

export const useAuthContext = () => React.useContext(AuthContext);

export const AuthContextProvider = ({ children }) => {
  const [user, setUser] = React.useState(null);
  const [loading, setLoading] = React.useState(true);

  React.useEffect(() => {
    const unsubscribe = onAuthStateChanged(auth, (user) => {
      if (user) {
        console.log("user change");
        setUser(user);
      } else {
        setUser(null);
      }
      setLoading(false);
    });

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

  return (
    <AuthContext.Provider value={{ user }}>
      {loading ? <div>Loading...</div> : children}
    </AuthContext.Provider>
  );
};

字符串
Login.js(查看评论):

const { user } = useAuthContext();   // Gives Current User
  
  async function handleSignIn() {
    if (password && email) {
      const { result, error } = await signIn(email, password); // signin with email function rest is   handled in an other file where the signin with Email Passowrd fucntion is called
      
      console.log(user);    // Giving undefined
      if (error) {
        setErrorStop(error);
      } else {
        router.push("/blog");  // Tried on /blog page too the same AuthContext but still un defined
      }
    }
  }


有些人可能会说,用户可能需要时间来初始化,我尝试了它在一个单独的页面,但它仍然给未定义。

3npbholx

3npbholx1#

看起来您希望在signIn函数完成后立即更新user

const { result, error } = await signIn(email, password);      
console.log(user);

字符串
这不是Firebase身份验证状态侦听器的工作方式,也不是react钩子的工作方式。user不会在组件代码期间更新。组件的当前运行必须完全完成,然后将使用更新的用户变量进行新的运行。您的组件应该在登录过程中单独检查用户。

相关问题