(index):36 Uncaught TypeError: firebase.auth is not a function答案

【问题标题】：(index):36 Uncaught TypeError: firebase.auth is not a function(index):36 Uncaught TypeError: firebase.auth is not a function
【发布时间】：2020-06-01 17:00:22
【问题描述】：

index.html 代码

<html>
    <head>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
        <script src="http://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha256-4+XzXVhsDmqanXGHaHvgh1gMQKX40OUvDEBTu8JcmNs=" crossorigin="anonymous"></script>
        <link rel="stylesheet" href="css/style.css" />
        <script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-app.js"></script>
        <script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-analytics.js"></script>
        <script defer src="https://www.gstatic.com/firebasejs/7.14.6/firebase-auth.js"></script>

    </head>
    <body class="bg-dark">
        <div id="login-card" class="card">
            <div class="card-body">
                <h1>Wallpaper App Admin</h1>

                <form id="login-form">
                    <div class="form-group">
                        <label for="email">Email</label>
                        <input type="email" id="email" class="form-control"/>
                    </div>
                    <div class="form-group">
                        <label for="password">Password</label>
                        <input type="password" id="password" class="form-control"/>
                    </div>
                    <div class="form-group">
                        <button type="button" class="btn btn-primary" id="btn-login">Login</button>
                    </div>
                </form>
            </div>
        </div>

        <script src="js/app.js"></script>

        <script>
            firebase.auth().onAuthStateChanged(function(user) {
                if (user) {
                    window.location.href = "admin.html";
                } else {
                    // No user is signed in.
                }
            });
        </script>
    </body>

</html>

app.js 代码

var firebaseConfig = {
    apiKey: "*******",
    authDomain: "******",
    databaseURL: "*****",
    projectId: "*****",
    storageBucket: "*****",
    messagingSenderId: "*****",
    appId: "*****",
    measurementId: "*****"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);



    $("#btn-login").click(function(){

        var email = $("#email").val();
        var password  = $("#password").val();

        var result = firebase.auth().signInWithEmailAndPassword(email, password);
        result.catch(function(error){
            var errorCode = error.code;
            var errorMessage = errror.message;

            console.log(errorCode);
            console.log(errorMessage);
        });
    });

在这里，我使用 Firebase 身份验证唱歌方法作为电子邮件/密码。并在 Firebase 控制台中启用它。我已经在 firebase 控制台中保存了一位用户。但是我有这样的错误，所以我的网站不能正常工作。这是错误

(index):36 Uncaught TypeError: firebase.auth is not a function
    at (index):36

这行显示为错误行，但我不明白为什么。

firebase.auth().onAuthStateChanged(function(user) {

这行我有一些问题。 firebase 文档中的代码行相同，但它不起作用。我正在使用 Visual Code 作为编码工具。

【问题讨论】：

标签： javascript html firebase firebase-authentication

【解决方案1】：

从 firebase-auth 脚本的脚本标记中删除 defer。这导致它仅在您的代码需要它之后才被加载。

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

了解defer。

【讨论】：

太棒了！在 Stack Overflow 上，如果答案有帮助，通常会使用左侧的按钮进行投票并将答案标记为正确。