reactjs currentUser返回空值

x759pob2 于 2022-11-29 发布在 React

关注(0)|答案(1)|浏览(125)

我有一个React应用程序使用firebase认证。
用户登录后，它会将用户重定向到books页面。

import { auth, firebase } from "./firebase";
async function googleLogin() {
    const provider = new firebase.auth.GoogleAuthProvider();
    await auth.signInWithPopup(provider).then(
      async (result) => {
        const token = await auth?.currentUser?.getIdToken(true);
        if (token) {
          localStorage.setItem("@token", token);
          navigate("/book-list");
        }
      },
      function (error) {
        console.log(error);
      }
    );
}

然后在books页面中，我尝试获取currentUser以便调用getIdToken()，但currentUser返回null。

import { auth } from "./firebase";
const currentUser = auth.currentUser

下面是firebase.js文件：

import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';

const firebaseConfig = {...};

firebase.initializeApp(firebaseConfig);

const auth = firebase.auth();
export { auth, firebase };

如何在用户登录后从另一个文件调用currentUser？

reactjs

来源：https://stackoverflow.com/questions/71669571/currentuser-is-returning-null

1条答案

按热度按时间

fivyi3re1#

这是预期的行为。由于books页面是一个新页面，Firebase SDK需要从本地存储中恢复身份验证状态，并在本地存储中自动保存。这需要它调用服务器，例如检查帐户是否已被禁用。由于我们无法阻止页面加载，您的主代码继续执行，并看到currentUser为空。
您需要做的是 * 侦听用户的身份验证状态 *，如获取当前用户的文档中的第一个片段所示：

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // User is signed in, see docs for a list of available properties
    // https://firebase.google.com/docs/reference/js/firebase.User
    var uid = user.uid;
    // ...
  } else {
    // User is signed out
    // ...
  }
});

当用户会话恢复、失败、没有登录用户或身份验证状态发生更改时，此回调将自动触发，因此，它是更新应用程序以获得最新身份验证状态的理想位置。

赞(0）回复(0）举报 2022-11-29

我来回答

reactjs currentUser返回空值

1条答案

相关问题

热门标签

最新问答