繁体   English   中英

在 expo 中通过 firebase 进行电子邮件验证的问题

[英]Issue with email verification via firebase in expo

根据how to verify user email in firebase react native(Expo) 通过 expo 在 firebase 中创建帐户后,我可以立即发送电子邮件验证。 但我做起来有困难。

这是我的注册屏幕文件中的代码:

import { StyleSheet, Text, View, KeyboardAvoidingView, TextInput, TouchableOpacity } from 'react-native'
import React from 'react'
import { useNavigation } from '@react-navigation/native';
import { createUserWithEmailAndPassword } from "firebase/auth"
import { useState } from 'react'
import { auth } from '../firebase'
import { signOut } from 'firebase/auth'
import {sendEmailVerification } from "firebase/auth";

const RegisterScreen = () => {
    const [email, setEmail] = useState('')
    const [password, setPassword] = useState('')
    const [name, setName] = useState('')
    const [showError, setShowError] = useState(false);
    const navigation = useNavigation()
    const handleSignUp = async () => {
        try {
        if (email && password) {
           setShowError(false);
           const { user } = await createUserWithEmailAndPassword(auth, email, password)
           console.log('Registered as :' , user.email);
           try{
            const {user} = await sendEmailVerification(auth, email)
           }
           catch{
            
           }
           try{
            await signOut(auth)
            console.log("Signed out successfully")
            navigation.replace("Login")
          }catch (error) {
            console.log({error});
         }
          }
        } catch (error) {
           console.log({error});
           setShowError(true);
        }
    }
    return (

目前该帐户已创建,但没有电子邮件验证发送到注册的电子邮件。 谁能帮我解决这个问题? 非常感谢你。

编辑1:

 try {
        if (email && password) {
           setShowError(false);
           createUserWithEmailAndPassword(email, password).then(async 
                ({user}) => {
                // 2. Send verification email
                await user.sendEmailVerification()
                console.log("Verification email sent!")  
           })
           catch{

           }
           try{
            await signOut(auth)
            console.log("Signed out successfully")
            navigation.replace("Login")
          }catch (error) {
            console.log({error});
         }
          }
        } catch (error) {
           console.log({error});
           setShowError(true);
        }

以下给了我: 在此处输入图像描述

此外,自动登录发生但没有注销帐户

编辑2:

try {
        if (email && password) {
           setShowError(false);
           const { user } = await createUserWithEmailAndPassword(auth, email, password)..then(async ({user}) => {
           // 2. Send verification email
           await user.sendEmailVerification()
           console.log("Verification email sent!") 
           console.log('Registered as :' , user.email);
          
           try{
            await signOut(auth)
            console.log("Signed out successfully")
            navigation.replace("Login")
          }catch (error) {
            console.log({error});
         }
          }
        } catch (error) {
           console.log({error});
           setShowError(true);
        }

以上也行不通。 它给了我: 在此处输入图像描述

而且注销也不再起作用了。 在这种情况下,仍然可以以某种方式接受相同的电子邮件。 我不知道为什么。 但是没有存储在 firebase 中

```从'firebase'导入firebase时出错在此处输入图像描述

目前我的 registerscreen.js

import { StyleSheet, Text, View, KeyboardAvoidingView, TextInput, TouchableOpacity } from 'react-native'
import React from 'react'
import { useNavigation } from '@react-navigation/native';
import { createUserWithEmailAndPassword } from "firebase/auth"
import { useState } from 'react'
import { auth } from '../firebase'
import { signOut } from 'firebase/auth'
import {sendEmailVerification } from "firebase/auth";


const RegisterScreen = () => {
    const [email, setEmail] = useState('')
    const [password, setPassword] = useState('')
    const [name, setName] = useState('')
    const [showError, setShowError] = useState(false);
    const navigation = useNavigation()
    const handleSignUp = async () => {
        try {
        if (email && password) {
           setShowError(false);
           const { user } = await createUserWithEmailAndPassword(auth, email, password).then(async ({user}) => {
            auth().currentUser.sendEmailVerification()
            console.log("Verification email sent!")  
        })
           console.log('Registered as :' , user.email);
           
           try{
            await signOut(auth)
            console.log("Signed out successfully")
            navigation.replace("Login")
          }catch (error) {
            console.log({error});
         }
          }
        } catch (error) {
           console.log({error});
           setShowError(true);
        }
    }
    return (
    <KeyboardAvoidingView  //To prevent keyboard from blocking the writing area
        style={styles.container}
        behavior = "padding"
    >  
        <View style = {styles.inputContainer}> 
            <Text>Email:</Text>
            <TextInput
                placeholder = "Email"
                value={email}
                onChangeText ={text => setEmail(text)}
                style = {styles.input} 
            />
            <Text></Text>
            <Text>Password:</Text>         
            <TextInput
                placeholder = "Password (Min: 6 chars)"
                value={password}
                onChangeText ={text => setPassword(text)}
                style = {styles.input} 
                secureTextEntry //Hide password
            />
            
            
        </View> 
        {showError && <View style={styles.error}>
          <Text>Email taken or password not valid - Min: 6 char</Text>
        </View>}        
        <View style = {styles.buttonContainer}>
            <TouchableOpacity
                onPress = {handleSignUp}
                style = {styles.button}
            >
                <Text style={styles.buttonText}>Register</Text>
            </TouchableOpacity>
        </View>                            
    </KeyboardAvoidingView> 
  )
}

您需要在用户登录后使用用户实例进行验证,如下所示:

createUserWithEmailAndPassword(emailID, password).then(async ({user}) => {
  // 2. Send verification email
  await firebase.auth().currentUser.sendEmailVerification()
  console.log("Verification email sent!")  
})

我认为问题是您没有完成sendEmailVerification()的配置。 它接受一个对象参数。

火力地堡文档

.then(() => {
    auth().currentUser.sendEmailVerification({
      handleCodeInApp: true,
      url : 'https://ENTER AUTHDOMAIN FROM YOUR FIREBASE CONFIGURATION'
    })
  })

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM