如何在离子身份验证中显示无效电子邮件？

Question

我正在制作一个登录页面，希望它在用户输入的电子邮件或密码不匹配时显示一条警告消息。

此外，如果电子邮件或密码不匹配，那么连同显示的错误，它应该不转到下一页。

我写了一个代码，它不仅不显示警报消息，而且转到到下一页，即使用户未通过身份验证（即输入的电子邮件和密码有误）这是我的代码。请帮忙！

user= {} as User;

async login(user:User)
  {
   try
   {
      const result=this.angfire.auth.signInWithEmailAndPassword(user.email,user.password);
      if(result)
      {
          this.navCtrl.setRoot(HomeManagerPage);
      }


   }
   catch(e)
   {
       var errorCode = e.code;
       var errorMessage = e.message;
       if (errorCode === 'auth/wrong-password')
       {
         alert('Wrong password.');
       } 
       else
       {
         alert(errorMessage);
       }
       console.log(e);


   }

Answer 1

据我所知，您的代码总会有一个结果，它是错误的还是成功的，所以即使没有登录，它也会始终重定向到该页面。尝试使用登录方法返回的承诺，而不是您使用的 try/catch。

async login(user:User){
  this.angfire.auth.signInWithEmailAndPassword(user.email,user.password)
  .then(res => {
    this.navCtrl.setRoot(HomeManagerPage);
  }, err => {
    let msg;
    switch (err.code) { // SWITCH THE CODE RETURNED TO SEE WHAT MESSAGE YOU'LL DISPLAY
      case "auth/wrong-password":
        msg= "Email or Password is wrong.";
        break;

      case "auth/user-not-found":
        msg= 'User not found.'
        break;

      case "auth/invalid-email":
        msg= 'Email or Password is wrong.';
        break;
    }

    alert(msg);
  });
}

因此，请始终尝试使用 firebase/angularfire 方法返回的承诺，你会没事的。

希望对您有所帮助。

Answer 2

您的函数前面有 async 关键字。 async总是returns一个隐含的承诺，它的解析值将是你从函数return得到的任何值（在本例中result）。正如前面的答案所指出的，您总是有一个 result，无论如何都会将您定向到下一页。使用 try/catch 的全部意义在于利用 async 和 await。如果没有 await，您的 try/catch 将无法处理任何同步和异步错误。

使用这个：

const result=await this.angfire.auth.signInWithEmailAndPassword(user.email,user.password);

catch 方块现在开始发挥作用。

如何在离子身份验证中显示无效电子邮件？

How to display invalid email in authentication in ionic?

authentication

firebase

angularfire

ionic2

angular