React Native Firebase未定义不是一个对象（评估'this.storage.setItem'）

Question

这是我第一次使用 firebase，我尝试设置持久性但出现错误。我是 在 react native 上使用 expo。这是我的代码：

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

const confirmCode = async () => {
        const credential = firebase.auth.PhoneAuthProvider.credential(
          verificationId,
          code
        );
    
        firebase
          .auth()
          .setPersistence(firebase.auth.Auth.Persistence.LOCAL)
          .then(async () => {
            return firebase
              .auth()
              .signInWithCredential(credential)
              .then((result) => {
                setIsNew(result.additionalUserInfo.isNewUser);
                result.user.getIdToken().then((token) => setUserToken(token));
              });
          })
          .catch((error) => {
            console.log(error.message);
          });
      };

我收到错误未定义不是一个对象（评估'this.storage.setItem'）当涉及到持久化时。

我正在使用 google 文档中的 this 页面和最新版本的 firebase 9.6.8。无需持久性即可正常工作，但用户每次打开应用程序时都必须登录。

我在 stackoverflow 和 github 上搜索了数十个线程，但没有找到该问题的任何答案。

而且这也没有显示任何用户无论是否坚持登录：

if (firebase.auth().currentUser !== null) {
    console.log(firebase.auth().currentUser.uid);
  } else {
    console.log("no users logged");
  }

我考虑过以某种方式使用异步存储，但我真的不知道如何让它工作。

Answer 1

如果有人遇到同样的问题 - 我在 Bernard Allotey 的帮助下设法解决了它。这是我的做法：

在 App.js 中：

    import { initializeApp } from "firebase/app";
    import { initializeAuth } from "firebase/auth";
    import { getReactNativePersistence } from "firebase/auth/react-native";
    import AsyncStorage from "@react-native-async-storage/async-storage";
    import firebaseConfig from "./firebaseConfing";
    
    useEffect(async () => {
        const defaultApp = initializeApp(firebaseConfig);
        initializeAuth(defaultApp, {
          persistence: getReactNativePersistence(AsyncStorage),
        });

     }, []);

在我的第一个屏幕中：

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

onAuthStateChanged(getAuth(), (user) => {
    if (user) {
      console.log(user);
    } else {
      console.log("signed out");
    }
  });

对于登录，我使用这个：

    import { getAuth, signInWithPhoneNumber } from "firebase/auth";
    
    async function sendVerification() {
        const auth = getAuth();
        signInWithPhoneNumber(
          auth,
          countryCode + phoneNumber,
          recaptchaVerifier.current
        ).then((confirmationResult) =>
          navigation.navigate("SmsCode", {
            confirmationResult: confirmationResult,
            phoneNumber: phoneNumber,
          })
        );
      }
    
// next screen

    const confirmCode = async () => {
        confirmationResult.confirm(code).then((result) => {
          result.user.getIdToken().then(async (token) => {
            setUserToken(token);
          });
        });
      };

现在用户按照我的意愿坚持了。非常感谢您的帮助。

Answer 2

好吧，所以我意识到，为了保留登录状态，如果使用 expo，您实际上必须执行一个特殊的过程。您需要初始化自己的身份验证，传入异步存储，如下所示。这样做时，不需要设置持久化。

import { initializeApp } from "firebase/app"
import { initializeAuth } from "firebase/auth"
import { getReactNativePersistence } from "firebase/auth/react-native"
import AsyncStorage from "@react-native-async-storage/async-storage"

const defaultApp = initializeApp(config);
initializeAuth(defaultApp, {
  persistence: getReactNativePersistence(AsyncStorage)
});

Answer 3

这就是 2024 年 2 月对我有用的方法。

import firebase from 'firebase/compat/app';
import { initializeAuth, getReactNativePersistence } from 'firebase/auth';
import AsyncStorage from '@react-native-async-storage/async-storage';

import "firebase/compat/auth";
// import "firebase/compat/firestore";
// import "firebase/compat/functions";
// import "firebase/compat/storage";

import firebaseConfig from '../firebase';

if (!firebase.apps.length) {
    const defaultApp = firebase.initializeApp(firebaseConfig);
    initializeAuth(defaultApp, {
        persistence: getReactNativePersistence(AsyncStorage)
    });
}