javascript - Firebase.js : Authentication doesn't work as expected

Question

每当用户输入正确的电子邮件/密码时，我都会尝试在控制台上打印成功。我输入了错误信息并且它有效，但是对于正确的用户，控制台也不会记录成功或附加到 errors div

 document.getElementById("login").addEventListener("click", function(){
            var email = $('#email').val();
            var password = $('#password').val();
            app.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
          // Handle Errors here.
            var errorCode = error.code;
            var errorMessage = error.message;

            if (error) {
                console.log(error.message)
                  $("#errors").append('   <br><div class="uk-alert-danger" uk-alert> <a class="uk-alert-close" uk-close></a> <p>'+ error.message + '</p></div>       <br>');

            }
              $("#errors").append('   <br><div class="uk-alert-success" uk-alert> <a class="uk-alert-close" uk-close></a> <p>Login Success, Welcome</p></div>       <br>');
              console.log("success")


         });
 });

有人能指出我做错了什么吗？

Answer 1

这是因为您尝试在 catch() 方法中检测是否成功。

自 signInWithEmailAndPassword()方法返回一个 Promise，您应该使用 then() 方法，如下所示:

 document.getElementById("login").addEventListener("click", function(){
            var email = $('#email').val();
            var password = $('#password').val();
            app.auth().signInWithEmailAndPassword(email, password)
             .then(function(userCredential) {
                    console.log(userCredential.user);
                    $("#errors").append('   <br><div class="uk-alert-success" uk-alert> <a class="uk-alert-close" uk-close></a> <p>Login Success, Welcome</p></div>       <br>');
                    console.log("success")
             })
             .catch(function(error) {
             // Handle Errors here.
               var errorCode = error.code;
               var errorMessage = error.message;

               // if (error) { // Not needed anymore
                   console.log(error.message)
                    $("#errors").append('   <br><div class="uk-alert-danger" uk-alert> <a class="uk-alert-close" uk-close></a> <p>'+ error.message + '</p></div>       <br>');


         });
 });