我编写了一个具有登录表单的 web 应用程序,但它不起作用,也不会返回任何错误。这里是 main.js 函数和调用它的 HTML 代码。
function signinUser() {
var email = document.getElementById("inputEmail").value;
var password = document.getElementById("inputPassword").value;
firebase.auth().signInWithEmailAndPassword(email, password).then((userCredential) => {
var user = userCredential.user;
console.log(user);
}).catch((error) => {
var errorCode = error.code;
var errorMessage = error.message;
if (errorCode === 'auth/wrong-password')
alert("Password errata!");
console.log("Error code: " + errorCode);
console.log("Error message: " + errorMessage);
});
}
这是我登录页面上的 HTML 代码:
<form id="login" class="form-signin position-absolute top-50 start-50 translate-middle">
<img class="mb-4" src="img/logo.png" alt="" width="72" height="72">
<h1 class="h3 mb-3 fw-normal">Login</h1>
<label for="inputEmail" class="visually-hidden">Email address</label>
<input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
<label for="inputPassword" class="visually-hidden">Password</label>
<input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="remember-me"> Remember me
</label>
</div>
<button class="w-100 btn btn-lg btn-primary" type="submit" onclick="signinUser();">Sign in</button>
<p class="mt-5 mb-3 text-muted">© 2021</p>
</form>
答案 0 :(得分:0)
在您的表单中,您将按钮声明为 submit
类型的按钮:
<button class="w-100 btn btn-lg btn-primary" type="submit" onclick="signinUser();">Sign in</button>
这会导致您的表单在异步 Firebase signInWithEmailAndPassword()
方法完成之前提交。
将按钮更改为 type="button"
将解决问题(请参阅 W3 specification)。不会提交表单,但这根本不是问题:您不希望提交表单,您只想使用从表单中获取的正确值调用 Firebasse 方法(即 email
和password
)。