无法连接用户

Question

我目前正在开发一个具有管理仪表板的网站，但我无法登录。Firebase 配置是从网站复制的，并且使用电子邮件和密码激活身份验证。这是我的代码：    <script src="https://www.gstatic.com/firebasejs/8.0.1/firebase-auth.js"></script>    <script>        // CONFIG FIREBASE        const firebaseConfig = {            // Firebase config is copied from the Firebase project        };        firebase.initializeApp(firebaseConfig);        // WORK ON USER        const myButton = document.getElementById('signing');        const emailField = document.getElementById('inputEmail');        const passwordField = document.getElementById('inputPassword');        myButton.addEventListener(`click`, function() {            const email = emailField.value;            const password = passwordField.value;                        firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {                const errorCode = error.code;                const errorMessage = error.message;                alert('Error : ' + errorCode + ' - ' + errorMessage);            });            firebase.auth().onAuthStateChanged(function(user) {                if (user) {                    const displayName = user.displayName;                    const emailU = user.email;                    alert('Hello ' + displayName + '!');                    alert('Your mail is ' + emailU);                } else {                    alert('Not logged !');                }            });        });    </script>`对应表格的代码：<form class="form-signin">  <img    class="mb-4"    src="assets/images/logo.png"    alt=""    width="72"    height="72"  />  <h1 class="h3 mb-3 font-weight-normal">Se connecter</h1>  <label for="inputEmail" class="sr-only">Email address</label>  <input    type="email"    id="inputEmail"    class="form-control"    placeholder="Email"    required    autofocus  />  <label for="inputPassword" class="sr-only">Password</label>  <input    type="password"    id="inputPassword"    class="form-control"    placeholder="Mot de passe"    required  />

Answer 1

您的问题很可能是由于您的表单是在触发Firebase方法之前提交的。signInWithEmailAndPassword()

如表单代码所示，您使用 type 声明按钮submit：

<form class="form-signin">

    // ....

    <button id="signing" class="..." type="submit">Se connecter</button>

    // .... 

</form>

您不想提交表单，您只想获取在字段中输入的值并将它们传递给方法signInWithEmailAndPassword()。

因此，如果您将button类型分配给按钮，如下所示，它应该可以解决您的问题，因为表单将不会被提交。

<button id="signing" class="..." type="button">Se connecter</button>