似乎无法通过 Firebase 打开 Google 弹出窗口答案

【问题标题】：Can't seem to open a Google Popup through Firebase似乎无法通过 Firebase 打开 Google 弹出窗口
【发布时间】：2016-12-29 04:26:01
【问题描述】：

我一直在尝试使用 Firebase Google Auth 系统创建 Web 应用程序的门户以登录用户。我尝试在单击登录按钮时调用 signInWithPopup() 函数，但页面仍然莫名其妙地无响应。

<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Social Login Button</title>
  <script>
      //my Firebase initialization snippet
      var config = {
          apiKey: "AIzaSyBqscqBBOImd2QqtAWCl3VCuKNF4yNwmnc",
          authDomain: "appvise-25c65.firebaseapp.com",
          databaseURL: "https://appvise-25c65.firebaseio.com",
          storageBucket: "appvise-25c65.appspot.com"
      };
      firebase.initializeApp(config);
  </script>


  <script src="https://www.gstatic.com/firebasejs/3.3.0/firebase-app.js">      </script>
  <script src="https://www.gstatic.com/firebasejs/3.3.0/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/3.3.0/firebase-database.js"></script>

<script>
    firebase.auth().signInWithPopup(provider).then(function(result) {
        // This gives you a Google Access Token. You can use it to access the Google API.
        var token = result.credential.accessToken;
        // The signed-in user info.
        var user = result.user;
        // ...
    }).catch(function(error) {
        // Handle Errors here.
        var errorCode = error.code;
        var errorMessage = error.message;
        // The email of the user's account used.
        var email = error.email;
        // The firebase.auth.AuthCredential type that was used.
        var credential = error.credential;
        // ...
    });




</script>
    <link rel="stylesheet" href="style.css" type="text/css">




 </head>

    <body>

这是页面的实际标记。

      <div class="login-box">
        <h2>Social Login Button</h2>
        <a href="#" class="social-button" id="facebook-connect"  > <span>Connect with Facebook</span></a>
        <a href="#" class="social-button" id="google-connect"  onclick="signInWithPopup()" > <span>Connect with Google</span></a>
        <a href="#" class="social-button" id="twitter-connect"> <span>Connect with Twitter</span></a>
        <a href="#" class="social-button" id="linkedin-connect"> <span>Connect with LinkedIn</span></a>
    </div>
<script src="https://www.gstatic.com/firebasejs/3.3.0/firebase.js"></script>

    </body>
   </html>

将鼠标悬停在 signInWithPopup 时，会弹出提示“未解析的函数或方法”的错误，即使 Firebase 似乎已设置。

感谢您的宝贵时间。

【问题讨论】：

标签： javascript html authentication firebase firebase-authentication

【解决方案1】：

在包含 Firebase SDK 之前，您正在调用 firebase.initializeApp。移动这三行：

<script src="https://www.gstatic.com/firebasejs/3.3.0/firebase-app.js">      </script>
<script src="https://www.gstatic.com/firebasejs/3.3.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/3.3.0/firebase-database.js"></script>

在您的initializeApp 电话上方。

【讨论】：