在Expo(v 8.5.0)中使用Firebase身份验证(SDK 9)

e5nqia27  于 2023-01-31  发布在  其他
关注(0)|答案(1)|浏览(164)

在过去的一周里,我遇到了如下错误:auth/invalid-email Firebase: Error (auth/invalid-email).根据我的理解和其他堆栈,花了很多时间研究这个,并使用ChatGPT(不,它没有工作)配置文件是正确的,我的代码是正确的,但显然它不是。我已经检查了Firebase文档几次,它似乎 checkout ,但再次,显然它没有。

// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
    apiKey: "myAPI Key",
    authDomain: "myAuth Domain",
    projectId: "myProjectID",
    storageBucket: "myStorageBucket",
    messagingSenderId: "myMessageSenderID",
    appId: "myAppID",
    measurementId: "myMeasurementID"
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const auth = getAuth();
export { auth };

显然,出于安全目的,我在配置中有一个实际的API密钥。
现在,我认为我的问题就在这里,它在SignIn.js文件中。

import React, { useState } from 'react';
import { StyleSheet, Text, View, Button, TextInput } from 'react-native';
import tw from 'tailwind-react-native-classnames';
import { signInWithEmailAndPassword } from "firebase/auth";
import { auth } from "../firebaseConfig";

export default function Home() {

    const [email, setEmail] = useState("");
    const [password, setPassword] = useState("");

    let signIn = () => {
        signInWithEmailAndPassword(auth, email, password)
            .then((userCredential) => {
                const user = userCredential.user;
                console.log(user);
            })
            .catch((error) => {
                const errorCode = error.code;
                const errorMessage = error.message;
                console.log(errorCode, errorMessage);
                alert(errorMessage);
            });
    }

    return (
        <>
            <Button title="Sign In" onPress={signIn} st />
            <TextInput
                style={tw`pl-4 h-12 w-80 border-black border-2 rounded-xl`}
                placeholder="Email"
                onChange={text => setEmail(text)}
                value={email}
            />
            <TextInput
                style={tw`mt-4 pl-4 h-12 w-80 border-black  border-2 rounded-xl`} placeholder="Password"
                onChange={text => setPassword(text)}
                value={password}
                secureTextEntry={true}
            />

        </>
    );
}

同样,请记住我使用的是expo。另外,这里有以下依赖项,以及我安装到根目录的版本:

"dependencies": {
        "@expo-google-fonts/open-sans": "^0.2.2",
        "@expo-google-fonts/open-sans-condensed": "^0.2.2",
        "expo": "~47.0.12",
        "expo-app-loading": "~2.1.1",
        "expo-font": "~11.0.1",
        "expo-status-bar": "~1.4.2",
        "firebase": "^9.16.0",
        "react": "18.1.0",
        "react-native": "0.70.5",
        "tailwind-react-native-classnames": "^1.5.1"
      },
      "devDependencies": {
        "@babel/core": "^7.12.9",
        "autoprefixer": "^10.4.13",
        "postcss": "^8.4.21",
        "tailwindcss": "^3.2.4"
      }
    },

编辑:不知道是否要让你知道,但我正在使用地铁,因为它是提到使用的世博会文件的firebase。

const { getDefaultConfig } = require('@expo/metro-config');

const defaultConfig = getDefaultConfig(__dirname);
defaultConfig.resolver.assetExts.push('cjs');

module.exports = defaultConfig;
a8jjtwal

a8jjtwal1#

因此,在阅读了一遍又一遍,做了更多的研究,我的代码是正确的。但是,有一个错误来自SignIn.js文件,特别是来自<TextInputs>,而不是做onChange={text => setEmail(text)},它应该是onChangeText={text => setEmail(text)}。原因是onChangeText,我的理解是,它会调用函数,为每一个新的文本输入/更新。
有关onChangeonChangeText的更多信息,请访问Stack which explains the major difference

相关问题