解决方法:无法读取未定义的属性“ GoogleAuthProvider”

时间:2019-07-11 19:11:04

标签: javascript html firebase firebase-authentication

我正在使用Firebase进行身份验证,但是在设置时遇到了一些麻烦

我已经尝试了教程中提到的所有内容,但没有成功

https://www.youtube.com/watch?v=hb85pYZSJaI

  <body>
    <div id="firebaseui-auth-container"></div>
  </body>

  <!-- firebase -->
  <script src="https://www.gstatic.com/firebasejs/6.2.4/firebase-app.js"></script>

  <!-- firebaseUI -->
  <script src="https://cdn.firebase.com/libs/firebaseui/4.0.0/firebaseui.js"></script>
  <link
    type="text/css"
    rel="stylesheet"
    href="https://cdn.firebase.com/libs/firebaseui/4.0.0/firebaseui.css"
  />

  <script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
      apiKey: "AIzaSyBtnE9XZR_tYckh5dYlwKbFdG3Nqs7y6JI",
      authDomain: "example123-6edfb.firebaseapp.com",
      databaseURL: "https://example123-6edfb.firebaseio.com",
      projectId: "example123-6edfb",
      storageBucket: "",
      messagingSenderId: "113254883849",
      appId: "1:113254883849:web:2e6706cd75b6bbd9"
    };

    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);

    // FirebaseUI config.
    var uiConfig = {
      signInSuccessUrl: "algo.html",
      signInOptions: [
        // Leave the lines as is for the providers you want to offer your users.
        firebase.auth.GoogleAuthProvider.PROVIDER_ID,
        firebase.auth.FacebookAuthProvider.PROVIDER_ID,
        firebase.auth.TwitterAuthProvider.PROVIDER_ID,
        firebase.auth.GithubAuthProvider.PROVIDER_ID,
        firebase.auth.EmailAuthProvider.PROVIDER_ID,
        firebase.auth.PhoneAuthProvider.PROVIDER_ID
      ],
      // tosUrl and privacyPolicyUrl accept either url string or a callback
      // function.
      // Terms of service url/callback.
      tosUrl: "<your-tos-url>",
      // Privacy policy url/callback.
      privacyPolicyUrl: function() {
        window.location.assign("<your-privacy-policy-url>");
      }
    };

    // Initialize the FirebaseUI Widget using Firebase.
    var ui = new firebaseui.auth.AuthUI(firebase.auth());
    // The start method will wait until the DOM is loaded.
    ui.start("#firebaseui-auth-container", uiConfig);
  </script>

但是访问页面时出现此错误

(索引):49未捕获的TypeError:无法读取未定义的属性“ GoogleAuthProvider”     在(index):49

有什么想法吗?

1 个答案:

答案 0 :(得分:1)

您缺少auth脚本文件

在加载Firebase的位置添加此内容:

 <!-- firebase -->
  <script src="https://www.gstatic.com/firebasejs/6.2.4/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/6.2.4/firebase-auth.js"></script>
  <!-- firebaseUI -->
  <script src="https://cdn.firebase.com/libs/firebaseui/4.0.0/firebaseui.js"></script>

如果您需要更多信息,请查看文档here