web: Firebase authentication successful but returns a null user (Web)

dimanche 12 février 2017

Firebase authentication successful but returns a null user (Web)

I am having trouble authenticating users using firebase with my web application. Whenever I attempt a login the firebase.auth().signInWithEmailAndPassword(email, pass); function is called, the request is successful and the authStateChanged listener is triggered. However, inside the listener firebaseUser always returns null.

I have tried hosting the web application from a personal server and allowing the domain access to my firebase DB.

I also have an android application that works flawlessly with the same DB.

Here is my code:

(function() {

    // Initialize Firebase
      var config = {
        apiKey: "AIzaSyBtCBqqODTYrb1BxCOOyHRhrDboi7n6G4k",
        authDomain: "athlete-buddy.firebaseapp.com",
        databaseURL: "http://ift.tt/2l4B7G2",
        storageBucket: "athlete-buddy.appspot.com",
        messagingSenderId: "822225329435"
      };
      firebase.initializeApp(config);

      // Get elements

      const txtEmail = document.getElementById('username');
      const txtPassword = document.getElementById('password');
      const loginButton = document.getElementById('loginButton');

      loginButton.addEventListener('click', e => {

        const email = txtEmail.value;
        const pass = txtPassword.value;
        const auth = firebase.auth();

        const promise = auth.signInWithEmailAndPassword(email, pass);
        promise.catch(e => console.log(e.message));
      });

      firebase.auth().onAuthStateChanged(firebaseUser => {
        if(firebaseUser){
            console.log(firebaseUser);
        }
        else{
            console.log('not logged in');
        }
      })

}());

<!DOCTYPE html>
    <html>
    <head>
        <title>Athlete Buddy Login</title>
        <meta http-equiv="content-type" content="text/html;charset=utf-8">
        <link rel="stylesheet" type="text/css" href="allStyleSheet.css">
        <link rel="stylesheet" type="text/css" href="login.css">
        <link rel="icon" type="image/gif" href="pictures/ABLogo.png">
        <script src="http://ift.tt/2lFLe1F"></script>

</head>
<body>
<nav>
    <a href="#">Home</a>
    <a href="#">Login</a>
    <a href="#">Features</a>
</nav>

<img src="pictures/loginArt.png" id="loginTitle">

<div id="loginFormDiv">
    <form id="loginForm">
        Username: <input id="username" class="field" type="text" name="Username"> <br><br>
        Password: <input id="password" class="field" type="Password" name="Password"> <br><br>
        <input id="loginButton" type="submit" value="Login">
        <a id="createAccountButton" href="#">Create Account</a>
        <a id="forgotPassword" href="http://www.youtube.com/watch?v=dQw4w9WgXcQ">forgot password?</a>
    </form>
</div>

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

</body>
</html>

web

dimanche 12 février 2017

Firebase authentication successful but returns a null user (Web)

Aucun commentaire:

Enregistrer un commentaire