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

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总是隐式返回一个承诺，它的 resolve 值将是你从函数中return的任何值(在本例中为 result (。如上一个答案所述，您总是有一个 result ，无论如何，它又会将您引导到下一页。使用 try/catch 的全部意义在于利用 async 和 await .如果没有await，您的 try/catch 将无法处理任何同步和异步错误。

使用这个：

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

catch块现在将发挥作用。