Страница входа не перенаправляет на другую страницу - PullRequest
Новая
       0

Страница входа не перенаправляет на другую страницу

1 голос
/ 06 января 2020

Я пытаюсь создать страницу входа в сеть, используя HTML и javascript с firestore в качестве базы данных.

Проблема в том, что когда я заполняю форму входа, страница просто обновляется. Консоль не возвращает никаких ошибок. (обратите внимание, что после запуска страницы консоль также не возвращает никаких ошибок.)

"loginPage. html" 

<head>
    <script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
</head>
    <body>
        <div class="limiter">
            <div class="container-login100">
                <div class="wrap-login100 p-t-30 p-b-20">
                    <form id="loginForm" method="POST">
                        <img src="images/icons/diabeatis.jpg" width="70%" style="margin: 0px auto 20px;display: block;" alt="AVATAR">
                        <span class="login100-form-title p-b-40">
                        <font face="Montserrat">By Team Buendia</font>
                        </span>

                        <div class="wrap-input100 validate-input m-t-25 m-b-35" data-validate="Enter username">
                            <font face="Montserrat">Email</font>
                            <input class="input100" type="text" name="loginEmail" style="font-family:Montserrat;" id="loginEmail" required>
                            <span class="focus-input100"></span>
                        </div>

                        <div class="wrap-input100 validate-input m-b-50" data-validate="Enter password" >
                            <font face="Montserrat">Password</font>
                            <input class="input100" type="password" name="loginPassword" id="loginPassword" required>
                            <span class="focus-input100"></span>
                        </div>

                        <button type="submit" class="login100-form-btn" style="background-color:orange; font-family:Montserrat; cursor:pointer; font-weight:bold" id="btnLogin">Login</button>

                        <ul class="login-more p-t-40">
                            <li class="m-b-8">
                                <a href="signup.html" class="txt2" style="color:#01703D">
                                    <font face="Montserrat">Create Account</font>
                                </a>
                            </li>
                        </ul>
                    </form>
                </div>
            </div>
        </div>
    </body>
    <script src="signin.js">
        firebase.auth().onAuthStateChanged(function(user){
            if(user){
                window.location.href = "patientDashboard.html";
            }
        });
        </script>
    <script src="https://www.gstatic.com/firebasejs/7.6.1/firebase-app.js" ></script>
    <script src="https://www.gstatic.com/firebasejs/7.6.1/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.6.1/firebase-firestore.js"></script> 
</html>

Signin. js

(function(){
    //initialize the firebase app
    var config = {
               *assume there are credentials here*
        }; 

        firebase.initializeApp(config);
        var auth = null;
        var loginBtn= document.getElementById('btnLogin');

    //Login
    loginBtn.addEventListener('click', e => {
        e.preventDefault();
        if( $('#loginEmail').val() != '' && $('#loginPassword').val() != '' ){
        //login the user
        var data = {
            email: $('#loginEmail').val(),
            password: $('#loginPassword').val()
        };

        firebase.auth().signInWithEmailAndPassword(data.email, data.password)
            .then(function(authData) {
            auth = authData;
            })
            .catch(function(error) {
            console.log("Login Failed!", error);
            });
        }
    });
});

Затем он должен быть перенаправлен на эту страницу с именем PatientDashboard. html Предположим, что все js импорт уже присутствует. Я уже добавил этот код в вышеупомянутый html файл 

        <script src="signin.js">
        firebase.auth().onAuthStateChanged(function(){
            if(user){
                window.location.href = "loginPage.html";
            }
        });
        </script>

1 Ответ

1 голос
/ 06 января 2020

В вашем коде много проблем, во-первых: 1. вход в скрипт. js в данный момент не выполняется, так как вы заключаете его в функцию, но не вызываете 

(function () {
    ...do something here then don't forget to call the function by `()`
})();  // <--- this will execute whatever code within the function scope
ваш скрипт, который обрабатывал перенаправление, расположен не в том блоке, в котором вы 
<script src="signin.js">
   // any code here will only execute whenever the `signin.js` failed to load for any reason
</script>

, поэтому, чтобы ваш редирект работал, вам нужно сохранить его в другом блоке скрипта или, возможно, поместить в другое место по своему усмотрению

Я попытался воссоздать ваш код с исправлениями, упомянутыми выше, перенаправление работает нормально.

sidenote: если вы работаете с vanilla JS, то будьте последовательны, вы также используете jQuery, $.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...