Переключение HTML-страниц (не асинхронно) после аутентификации Google Firebase

Я пытаюсь создать веб-сайт, на котором я нажимаю кнопку, чтобы войти в систему с помощью Google, а затем он переходит на новую HTML-страницу.

Однако, когда появляется новое окно входа в Google, оно немедленно закрывается и html-страница изменяется.

  • Я хочу, чтобы html-страница изменилась, но: мне нужно войти в Google
    работать первым?

  • Есть ли способ подождать, пока пользователь войдет в систему, прежде чем перейти на новую страницу?

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

Не могли бы вы мне помочь?

    <html>
      <head>
//connect to css and javascript file
        <link rel="stylesheet" href="hackathon.css">
        <script src=scripts.js></script>
      </head>

      <script src="https://www.gstatic.com/firebasejs/4.1.3/firebase.js"></script>
      <script>
      // Initialize Firebase
      var config = {
        apiKey: "AIzaSyAOWTFIhpydI27RMa_JzOW0Ffyajb9sTqg",
        authDomain: "teach-and-learn-cd50e.firebaseapp.com",
        databaseURL: "https://teach-and-learn-cd50e.firebaseio.com",
        projectId: "teach-and-learn-cd50e",
        storageBucket: "",
        messagingSenderId: "412721016471"
      };
      firebase.initializeApp(config);
      </script>

      <br><br><br><br><br><br><br><br><br>
//create the header

<p><center><font face="Verdana" size="7" color="white">Teach and Learn</font></p>
    //login button
      <button class="button1">Log In</button>
    //google sign in 
      <script type="text/javascript">
        button=document.querySelector('button')
        database=firebase.database()
        reference=database.ref()
        button.onclick=function(){
        var provider = new firebase.auth.GoogleAuthProvider();

        firebase.auth().signInWithPopup(provider).then(function(result) {
           var token = result.credential.accessToken;
           var user = result.user;
           }).catch(function(error) {
           var errorCode = error.code;
           var errorMessage = error.message;
           var email = error.email;
           var credential = error.credential;
        })

         //immediately goes to this page without giving the use 
         //opportunity to sign in
        //main.html is loaded and the sign in window is closed
        window.location.href="./main.html";

      </script>
    </html>

2 ответа

Если вход выполнен успешно, код внутри function(result) побежит. Если вход в систему не удается, код внутри function(error) побежит. Что-нибудь внутри then будет ждать, пока вы не попытаетесь войти. Поместите код перенаправления внутри тогда.

Я пересмотрел ваш код в этом CodePen, чтобы вы могли попробовать его сами. Это очень важно, чтобы вы избавились от второго window.location.href = "./main.html"; в коде.

https://codepen.io/anon/pen/MoOeyv?editors=1000

Переместить window.location.href в обратный вызов?

firebase.auth().signInWithPopup(provider).then(function(result) {

    //..
    window.location.href="./main.html";

}).catch(function(error) {
    //..
});
Другие вопросы по тегам