getAuth() return 一个对象，但是当页面重新加载时 uid return null

Question

我的代码太庞大了；我只是放了一部分我认为必不可少的代码。

import {getAuth} from "firebase/auth"

const authFirebase = getAuth()
console.log(authFirebase)

const Home = () => {
  ...
  return(
   ...
  )
}

每当我重新加载页面 (F5) 时，如果我只是。

console.log(authFirebase)

我在 currentUser 属性中检索到一个包含 uid 的对象，但是当我这样编码时。

 console.log(authFirebase.currentUser.uid)

我遇到了这个错误

TypeError: Cannot read properties of null (reading 'uid')

我很困惑；我对 Firebase 不太了解？

Answer 1

import { getAuth, onAuthStateChanged } from "firebase/auth";

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

Answer 2

原因是您在用户对象准备好使用之前获取该对象。

如果它存在，你需要将它包装在一个条件中，然后记录到控制台。

另一种方法是添加像 onAuthStateChanged 这样的观察者，这将解决预取对象的问题。

firebase.auth().onAuthStateChanged( user =>; {
  if (user) { console.log(user) }
});

getAuth() return 一个对象，但是当页面重新加载时 uid return null

getAuth() return a object but uid return null when page reload

javascript

firebase

firebase-authentication