Firebase 身份验证重复出现错误

Question

我一直在尝试在一个非常基本的网站上首次设置 FirebaseUI 电子邮件和密码身份验证，但我遇到了多个错误，并且没有显示任何标志 in/sign up UI 应该是。它只是空的，只有加载程序显示。首先，我已确保 Firebase 已正确实施，并且托管和部署也运行良好。我还在控制台中启用了电子邮件和密码身份验证，并按照文档进行了设置。这是我到目前为止所做的：

<head>
    <script src="https://www.gstatic.com/firebasejs/8.9.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/ui/4.8.1/firebase-ui-auth.js"></script>
    <link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/4.8.1/firebase-ui-auth.css" />
</head>

<body>
    <h2>Testing</h2>
     <h1>firebase auth practice</h1>
     <div id="firebaseui-auth-container"></div>
     <div id="loader">Loading...</div>

    <script>
        var firebaseConfig = {
            // I've omitted this part for the purposes of the question.
        };
        firebase.initializeApp(firebaseConfig);
        
        import * as firebase from 'firebase';
        import * as firebase from 'firebase/auth';

        var ui = new firebaseui.auth.AuthUI(firebase.auth());

        ui.start('#firebaseui-auth-container', {
            signInOptions: [
                firebase.auth.EmailAuthProvider.PROVIDER_ID
            ]
            });

        var uiConfig = {
            callbacks: {
                signInSuccessWithAuthResult: function(authResult, redirectUrl) {
                return true;
                },
                uiShown: function() {
                document.getElementById('loader').style.display = 'none';
                }
            },
            signInFlow: 'popup',
            signInSuccessUrl: 'loggedin.html',
            signInOptions: [
                firebase.auth.EmailAuthProvider.PROVIDER_ID
            ],
            tosUrl: 'tos.html',
            privacyPolicyUrl: 'privacy.html'
            };

         ui.start('#firebaseui-auth-container', uiConfig);
    </script>

</body>

loggedin.html、tos.html 和 privacy.html 几乎都是空的。所有这些都取自文档，但我收到错误提示 firebase.auth() 不是函数，然后我尝试了 import 部分，并收到错误提示无法导入语句在模块外使用。我试图尝试其他人在 SO 上做了这些错误，例如使用 type="module"，但无济于事。我怀疑这个问题可能与导入位有关，但在 SO 或文档中找不到任何修复。

如有任何帮助，我们将不胜感激！

Answer 1

您尚未导入 Firebase 身份验证 SDK，FirebaseUI 依赖于它。

您需要将此行添加到您的 script 部分：

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

请注意，可能还有更多问题，但此更改应该可以解决您提到的 firebase.auth() is not a function。

如果在此之后您还有更多问题，请 post 每个问题都有自己的问题 MCVE（请阅读 link，因为它非常有用）。

Firebase 身份验证重复出现错误

Repeated errors with Firebase Authentication

html

javascript

firebase

firebase-authentication

firebaseui