Firebase User Won't Stay Signed in Even With Auth Persistence Change

Question

I have a very simple question that is probably going to make me look stupid. I am trying to have a sign in page for my users, and when they are signed in, redirect them to the index page. When I sign the user in on the login page, I set the AUTH PERSISTENCE to SESSION. It logs the user in with no problem on that page, but when it sends the user to the index page, they are no longer signed in. I am not getting any errors from sign ins, auth persistence changes, redirects, or anything for that matter.

Here is the login code for the login page:

    var remember = 0;
    console.log(document.getElementById('rember').value);
    function signIn() {
        var email = document.getElementById('email').value;
        var pass = document.getElementById('password').value;
        
        firebase.auth().signInWithEmailAndPassword(email, pass).catch(function(error) {
  var errorCode = error.code;
  var errorMessage = error.message;
  console.log('Error Code: ' + errorCode + ' Error Message: ' + errorMessage);
        
});
setTimeout(function(){
if (remember == 0) {

firebase.auth().setPersistence(firebase.auth.Auth.Persistence.SESSION)
  .then(function() {
    // Existing and future Auth states are now persisted in the current
    // session only. Closing the window would clear any existing state even
    // if a user forgets to sign out.
    // ...
    // New sign-in will be persisted with session persistence.
    return firebase.auth().signInWithEmailAndPassword(email, pass);
  })
  .catch(function(error) {
    // Handle Errors here.
    var errorCode = error.code;
    var errorMessage = error.message;
    
    console.log('Error Code: ' + errorCode + ' Message: ' + errorMessage)
  });
} else {
    firebase.auth().setPersistence(firebase.auth.Auth.Persistence.LOCAL)
  .then(function() {
    // Existing and future Auth states are now persisted in the current
    // session only. Closing the window would clear any existing state even
    // if a user forgets to sign out.
    // ...
    // New sign-in will be persisted with session persistence.
    return firebase.auth().signInWithEmailAndPassword(email, pass);
  })
  
}
var user = firebase.auth().currentUser;

if (user) {
  //
} else {
    console.log('Well, crap')
}
setTimeout(function(){
  window.location = "https://golfcoachcentral.com/dash/html/student/index.html";
 },8000)  },4000);
}

Here is the code for the index page, it is located in the body:

setTimeout(function(){
                        var user = firebase.auth().currentUser;

if (user) {
  // User is signed in.

                            var database = firebase.database();
                            var nameRef = firebase.database().ref('users/' + firebase.auth().currentUser.uid + '/name');
nameRef.on('value', function(snapshot1) {
  document.getElementById('upclassnamepro').innerHtml = snapshot1.val();
});
var emailRef = firebase.database().ref('users/' + firebase.auth().currentUser.uid + '/email');
emailRef.on('value', function(snapshot2) {
  document.getElementById('upclassemailpro').innerHtml = snapshot2.val();
  console.log(snapshot2.val())
});
} else {
  console.log('not working...');
  console.log(firebase.auth().currentUser.uid);
}
                        },6000);

What am I doing wrong that is preventing me from keeping the user logged in?

Answer 1

firebase.auth().currentUser isn't going to give you the currently signed in user when a new page first loads. You should use an auth state observer to get a callback when the user object is first known by the Firebase Auth SDK. You should wait on this callback if you need to do something with that user object, or make authenticated queries to a Firebase database.

firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    // User is signed in.
    // ...
  } else {
    // User is signed out.
    // ...
  }
});