在火库注册之前检查电子邮件是否真实

Question

我正在做一个小项目，我确实完成了所有的身份验证工作，但有一件事，我想知道如何在进入注册过程之前检查电子邮件是否真实，顺便说一句，我正在使用，我确实在网上看了，我确实找到了一个名为我确实尝试过的软件包，如果电子邮件是真实的，如果电子邮件是真的，如果电子邮件存在，但那不起作用当我使用它与反应它返回一个错误reactFirebaseemail-existencetruefalseimport firebase from '../util/firebase';const emailExistence = require('email-existence');export const normalSignup = (props, setSign, email, password, confirmPassword, username) => {  emailExistence.check(email, function (error, response) { // return error here addresses.sort is not a function    console.log('res: ' + response);  });}无论如何，我想知道是否有一种方法可以在没有外部包的情况下做到这一点，提前PS：am不使用云功能Firebase

Answer 1

好吧，假设您要检查电子邮件是否是经过验证的电子邮件地址，您可以通过以下方式编写代码

import firebase from '../util/firebase';

const App = {

  firebase: firebase,

  getLoggedInUser: () => {

    const currentUser = App.firebase.auth().currentUser

    if (currentUser) {

      return {

        email: currentUser.email,

        userId: currentUser.uid,

        isEmailVerified: currentUser.emailVerified

      }

    } else {

      return undefined

    }

  },

  isAuthenticated: () => {

    return (App.getLoggedInUser() && App.getLoggedInUser().isEmailVerified)

  },

  authenticate: async (email, password) => {

    await App.firebase.auth().signInWithEmailAndPassword(email, password)

  },

  signup: async (email, password) => {

    const userCredential = await App.firebase.auth().createUserWithEmailAndPassword(email, password)

    await userCredential.user.sendEmailVerification()

    return `Check your email for verification mail before logging in`

  },

这里发生以下情况

• 当用户注册该方法时，将调用该方法并发送电子邮件验证，如上面的代码所示signupfirebase

• 当用户登录时，该方法被调用，因此根据您登录authenticatefirebase

• 但是，要重定向或呈现某个页面，请在登录后使用该方法向特定用户显示页面isAuthenticated

• 因此，您可以将方法作为 prop 传递给 Web 应用程序，并按照您想要的方式呈现 Web 应用程序。isAuthenticatedreact-router

• 这样，只有经过验证的真实和真实的电子邮件ID才能访问您的应用程序

注意

这种方法已经在prod中工作，但它使用VueJS并且是github上的一个开源项目，让我知道，如果你想引用它

Answer 2

也许只是使用正则表达式来检查电子邮件是否有效？

根据这个网页的JavaScript，你只需要：

const emailRegex = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

if (emailRegex.test(email)) {

    console.log('Email valid!');

}

这不会阻止人们输入错误域的电子邮件，但可以确保如果有人使用不广为人知的邮件服务器，它也将被接受。

Answer 3

您在客户端的唯一选择（如果您在Firebase上，我想您没有运行Node后端的奢侈）来获取与电子邮件存在类似的服务，如果您使用电子邮件地址的端点，它将返回“有效”或“无效”的响应。GET

这些通常是高级服务，但如果您的流量较低，则可以尝试免费服务。在我的示例中，它是邮箱层。他们的端点可以这样调用（当然，如果你坚持客户端，这意味着任何人都可以通过浏览器网络选项卡从生产中窃取你的API密钥！

GET http://apilayer.net/api/check?access_key=YOUR_ACCESS_KEY&email=[e-mail]

这将返回一个 JSON：

{

  "email": "[e-mail]",

  "did_you_mean": "",

  "user": "support",

  "domain": "apilayer.net",

  "format_valid": true,

  "mx_found": true,

  "smtp_check": true,

  "catch_all": false,

  "role": true,

  "disposable": false,

  "free": false,

  "score": 0.8

}   

最好使用 ，它：score

[...]返回一个介于 0 和 1 之间的数字分数，以反映所请求电子邮件地址的质量和送达率。

在反应中：

  const [data, setData] = useState(null)

  const [emailToVerify, setEmailToVerify] = useState('[e-mail]') // just for the sake of example

  const apiKey = process.env.API_KEY

  const fetchEmailVerificationApi = useCallback(async () => {

    try {

      const response = await fetch(`http://apilayer.net/api/check?access_key=${apiKey}&email=${emailToVerify}`)

      const json = await response.json()

      setData(json.score) // returns a numeric score between 0 and 1 reflecting the quality and deliverability of the requested email address.

    } catch (e) {

      console.error(e)

    }

  }, [apiKey, emailToVerify])

  useEffect(() => {

    fetchEmailVerificationApi()

  }, [fetchEmailVerificationApi])