时间戳

首页 > 解决方案 > ReactJS 项目中的 Firebase 身份验证 - onAuthStateChanged 中的用户为 null

javascript - ReactJS 项目中的 Firebase 身份验证 - onAuthStateChanged 中的用户为 null

问题描述

我正在努力通过firebase设置电子邮件/密码身份验证。我的firebase配置设置是这样的

// Firebase App (the core Firebase SDK) is always required and must be listed first
import firebase from "firebase/app";
//authenticaion module
import "firebase/auth";

// Add the Firebase products that you want to use
import "firebase/firestore";

var firebaseConfig = {
 // I've got my api key and other info copied from the console in here
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


export const db = firebase.firestore();
export const app = firebase.auth();

我创建了一个登录表单，它调用以下函数：

import { app } from "../firebase/firebaseConfig";

  const createAccount = () => {
    app
      .createUserWithEmailAndPassword(email, password)
      .then((user) => {
        console.log("user created");
        console.dir(user);
      })
      .catch((error) => {
        console.log("something went wrong");
      });
  };

第一个问题：我没有看到“用户创建”消息，即使我可以看到在 Firebase 身份验证控制台中创建的用户。我也没有看到表明发生异常的“出现问题”消息。

第二个问题：我正在尝试在用户登录时进行重定向。为此，我已按照文档中的建议在 Firebase auth 对象上设置了一个侦听器：

firebase.auth().onAuthStateChanged((user) => {
  console.log("Inside listener");
  console.dir(user);
});

问题是，我看到了控制台消息，所以函数正在触发，但即使正在创建用户，这里的“用户”始终为空。

Firebase 版本：8.2.1

谁能看到我在这里缺少的东西？

标签： javascriptfirebasefirebase-authentication

解决方案

在身份验证状态侦听器中，您的回调首先被调用是正常的null，因为这通常是加载页面时的初始用户身份验证状态。

Firebase 会尝试自动恢复用户的身份验证状态，但这可能需要一些时间。只有在状态恢复后，它才会再次使用当时处于活动状态的用户帐户调用您的身份验证状态侦听器。

推荐阅读