我不明白為什么 firebase.auth().signInWithEmailAndPassword(email, password) 不起作用

Question

我正在嘗試使用 firebase 制作登錄頁面，我對此很陌生，並且一直在閱讀 firebase 文檔以找到解決我的問題的方法。

This is my function using the firebase.auth().signInWithEmailAndPassword() method from the firebase auth SDK.

 function toggleSignIn() { var email = document.getElementById('inputEmail').value; var password = document.getElementById('inputPass').value; if (email.length < 1) { alert('Please enter an email address.'); return; } if (password.length < 1) { alert('Please enter a password.'); return; } // Sign in with email and pass. firebase.auth().signInWithEmailAndPassword(email, password).catch(function (error) { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; if (errorCode === 'auth/wrong-password') { alert('Wrong password.'); } else { alert(errorMessage); } console.log(error); }); }

這將在藍月亮中運行一次，但在那之后將停止運行。 我在 HTML 頁面上單擊“登錄按鈕”，它只是清除了輸入 email 和輸入密碼框。 之后什么都沒有發生，我檢查了我的控制台 window 並且沒有用戶登錄。

這就是 HTML 的樣子

 <div id="Login-google" class="input-group-google"> <button id="Logout_buton" type="submit" class="submit-buton" onclick="toggleSignOut()"> Test Logout </button> </div> <form id="Login" class="input-group"> <input id="inputEmail" type="text" class="input-field" placeholder="Email" required> <input id="inputPass" type="text" class="input-field" placeholder="Password" required> <input type="checkbox" class="check-box"> <span> Remember Password </span> <button id="Login_buton" type="submit" class="submit-buton" onclick="toggleSignIn()"> Test Login </button> </form>

對此的任何幫助將不勝感激，我對此很陌生，請放輕松。

Answer 1

您正在提交表單，默認瀏覽器行為通過向給定的 URL 發出 POST 請求來提交表單。 如果您想阻止默認行為，您需要在提交方法中編寫e.preventDefault() 。 這是更新的代碼。

使用 forms onsubmit 事件提交表單

Javascript

function toggleSignIn(e) {
    e.preventDefault(); // prevent the default behaviour

    var email = document.getElementById('inputEmail').value;
    var password = document.getElementById('inputPass').value;

    if (email.length < 1) {
        alert('Please enter an email address.');
        return;
    }
    if (password.length < 1) {
        alert('Please enter a password.');
        return;
    }
    // Sign in with email and pass.
    firebase.auth().signInWithEmailAndPassword(email, password).then((response) => {
   console.log(response);
  // do something when sign in is successful
}).catch(function (error) {
        // Handle Errors here.
        var errorCode = error.code;
        var errorMessage = error.message;
        if (errorCode === 'auth/wrong-password') {
            alert('Wrong password.');
        } else {
            alert(errorMessage);
        }
        console.log(error);
    });

}

HTML

 <div id="Login-google" class="input-group-google">
                <button id="Logout_buton" type="submit" class="submit-buton" onclick="toggleSignOut()"> Test Logout </button>
            </div>

            <form id="Login" class="input-group" onsubmit="return toggleSignIn(event)">
                <input id="inputEmail" type="text" class="input-field" placeholder="Email" required>
                <input id="inputPass" type="text" class="input-field" placeholder="Password" required>
                <input type="checkbox" class="check-box"> <span> Remember Password </span>
                <button id="Login_button" type="submit" class="submit-button"> Test Login </button>
            </form>
 </div>