无法连接用户

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">&nbsp; &nbsp; // ....&nbsp; &nbsp; <button id="signing" class="..." type="submit">Se connecter</button>&nbsp; &nbsp; // ....&nbsp;</form>您不想提交表单，您只想获取在字段中输入的值并将它们传递给方法signInWithEmailAndPassword()。因此，如果您将button类型分配给按钮，如下所示，它应该可以解决您的问题，因为表单将不会被提交。<button id="signing" class="..." type="button">Se connecter</button>