Firebase onAuthStateChanged not firing on login

时间:2018-04-18 18:18:07

标签: javascript firebase firebase-authentication

I got firebase authentication to work to a point where I can create users, and log them in and out.

I need to make sure to do a few more things:

  • detect login/logout state change and do some actions based on this
  • get user ID on login so I can push them to the firebase DB

Unfortunately somehow my onAuthStateChanged method does not seem to be working. Also I'm not able to get user.uid - I'm getting an error that user is not defined. Here's my code:

<!DOCTYPE html>
<html lang="en-us">

<head>

    <meta charset="UTF-8">
    <title>Firebase Auth Test</title>

    <!-- Firebase JavaScript Link -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://www.gstatic.com/firebasejs/4.12.1/firebase.js"></script>
    <script src="https://www.gstatic.com/firebasejs/4.12.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/4.12.1/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/4.12.1/firebase-database.js"></script>
</head>

<body>

    <!-- JQuery -->


    <!-- ================================================================================== -->

    <script>
        $(document).ready(function () {
            // Initialize Firebase
            var config = {
                apiKey: "AIzaSyC0rCQY0jzdWe5AhcQpvIuKMr9XbnRWDsk",
                authDomain: "project1-e7460.firebaseapp.com",
                databaseURL: "https://project1-e7460.firebaseio.com",
                projectId: "project1-e7460",
                storageBucket: "project1-e7460.appspot.com",
                messagingSenderId: "87795057294"
            };
            firebase.initializeApp(config);
            // Get a reference to the database service
            var database = firebase.database();
            $("#signup").on("click", function () {
                event.preventDefault();
                var email = $("#email").val().trim();
                var password = $("#pass").val().trim();
                console.log('trying to create!');
                firebase.auth().createUserWithEmailAndPassword(email, password).catch(function (error) {
                    // Handle Errors here.
                    var errorCode = error.code;
                    var errorMessage = error.message;
                    // ...
                });

            });

            $("#refset").on("click", function () {
                event.preventDefault();
                console.log('ref set!');
                firebase.database().ref().set({
                    username: "name",
                    email: "email"
                });
            });

            $("#login").on("click", function () {
                    event.preventDefault();
                    var email = $("#email").val().trim();
                    var password = $("#pass").val().trim();
                    console.log('trying to log in!');
                    firebase.auth().signInWithEmailAndPassword(email, password).catch(function (error) {
                        // Handle Errors here.
                        var errorCode = error.code;
                        var errorMessage = error.message;
                        // ...
                    }).then(function(user) {
                        var user = firebase.auth().currentUser;
                    });
            });


        $("#logout").on("click", function () {
            event.preventDefault();
            console.log('trying Sign out in!');
            firebase.auth().signOut().then(function () {
                console.log('signed out!');
                // Sign-out successful.
            }).catch(function (error) {
                // An error happened.
            });
        });

        firebase.auth().onAuthStateChanged(function (user) {
            var user = firebase.auth().currentUser;
            if (user) {
                console.log('signed in!');
                // User is signed in.
            } else {
                // No user is signed in.
                console.log('not signed in');
            }
        });


        });
    </script>
    <br>
    <br>
    <br>
    <input id="email" placeholder="email" type="email">
    <input id="pass" placeholder="pass" type="password">
    <button id="signup" type="submit">Signup</button>
    <button id="login" type="submit">Log in</button>
    <button id="logout" type="submit">Log Out</button>
    <button id="refset" type="submit">Refset</button>
</body>

</html>

1 个答案:

答案 0 :(得分:0)

您不需要从观察者函数覆盖用户,因此将其更改为此(因此,当用户在if和uid for db storage中登录时,您将获得该事件):

firebase.auth().onAuthStateChanged(function(user) {
    //var user = firebase.auth().currentUser;
    if (user) {
        console.log('signed in!');
        console.log(user.uid);
        // User is signed in, call db storage function here
    } else {
        // No user is signed in.
        console.log('not signed in');
    }
});