Firebase身份验证-createUserWithEmailAndPassword()-在验证电子邮件之前禁止登录

时间:2019-09-02 21:13:55

标签: javascript firebase firebase-authentication

我希望使用createUserWithEmailAndPassword()在Firebase Auth中创建一个用户帐户-无需登录用户。我希望用户先验证电子邮件地址。直接登录用户会导致很多不必要的副作用。

/ signup页面具有以下代码-我希望用户在注册后停留在/ signup页面上,以便能够看到注册消息。

firebase.auth().createUserWithEmailAndPassword(data.email, data.password)
.then((user)=> {
  //Send email verification link
  user.sendEmailVerification()
  //Show message - "Your account was created - please verify using link in email"
  handleStatusMessage(AUTH_SUCCESS)
})
.catch((error)=>{...})

app.js具有以下登录和重定向处理程序

//handle login and redirect
firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    if(!user.emailVerified){
      //Exit if email is not verified
      console.log('auth.js exit')
      //Line 7
    }
    store.dispatch(setInitialStore()).then(() => {
      renderApp()
      //Brings user to start page
      if (history.location.pathname === '/login') {
        history.push('/start')
      }
    })
} else {
  renderApp()
  //Brings user to /login or /verifyEmail page when logged out
  if(!history.location.pathname.includes('/verifyEmail')){
    history.push('/login')
  }  
}

我的问题是:

  1. 成功注册后,用户将被重定向,除非我在第7行取消执行

  2. 如果我在第7行取消执行,则用户在离开/ signup时会陷入困境

  3. 注销用户会导致onAuthStateChanged()触发两次-重定向用户

在成功创建帐户之后,如何使用户保持在/ signup页面上,同时仍然允许用户导航到/ login / verifyEmail位置?最好处于注销状态。

2 个答案:

答案 0 :(得分:4)

Firebase身份验证功能createUserWithEmailAndPassword在成功创建帐户(不需要电子邮件验证)后自动登录用户。

如果您需要在没有自动登录的情况下验证新用户注册的电子邮件地址,则可以选择Email Link Authentication

  

您可以通过向用户发送包含链接的电子邮件来使用Firebase身份验证来登录用户,他们可以单击该链接进行登录。 在此过程中,还将验证用户的电子邮件地址。

     

通过电子邮件登录有很多好处:

     
      
  • 低摩擦注册和登录。
  •   
  • 降低跨应用程序重复使用密码的风险,这甚至会损害甚至精心选择的密码的安全性。
  •   
  • 在验证用户身份的同时还可以验证用户是否是电子邮件地址的合法所有者。
  •   
  • 用户只需要一个可访问的电子邮件帐户即可登录。不需要电话号码或社交媒体帐户的所有权。
  •   
  • 用户无需提供(或记住)密码即可安全登录,这在移动设备上可能很麻烦。
  •   
  • 以前使用电子邮件标识符(密码或联盟身份)登录的现有用户可以升级为仅使用电子邮件登录。例如,忘记密码的用户仍可以登录而无需重置密码。
  •   

用户通过电子邮件链接身份验证成功创建帐户后,您可以提供创建密码和link to the existing account的选项。

答案 1 :(得分:4)

我最终要做的是添加对用户登录和注销期间登录的检查。

signupPage.js

firebase.auth().createUserWithEmailAndPassword(data.email, data.password)
.then((user)=> {
  //Login is triggered --> line 4 in app.js
  user.sendEmailVerification() //Send email verification
  handleStatusMessage(AUTH_SUCCESS) //Show success message
  firebase.auth().signOut() //Logout is triggered --> line 16 in app.js
})
.catch((error)=>{ ... }

app.js

//handle login and redirect
firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    //** line 4 ** EXIT if logged in from /signup
    if(!isEmailVerified && history.location.pathname.includes('/signup')){
      return
    }
    store.dispatch(setInitialStore()).then(() => {
      renderApp()
      //Brings user to start page
      if (history.location.pathname === '/login') {
        history.push('/start')
      }
    })
} else {
  //** line 16 ** EXIT if logged out from /signup
  if(history.location.pathname.includes('/signup')){
    return
  }
  renderApp()
  //Brings user to /login or /verifyEmail page when logged out
  if(!history.location.pathname.includes('/verifyEmail')){
    history.push('/login')
  }  
}

真的希望 createUserWithEmailAndPassword()选项能够自动发送电子邮件验证电子邮件,而登录用户避免使用这种猫猫游戏代码。 :)

类似于 createUserWithEmailAndPasswordEmailVerificationRequired()的单独方法,该方法自动发送电子邮件链接,并且不登录,用户也可以使用;)