firebase.auth().CurrentUser.uid is giving null after successful login

Question

I have made use of firebase login. It is logging in successfully. I have four pages inside login page profile, sell, buy and about us. When I am retrieving the value of current user's uid in profile and sell page. But i am getting null in buy page why is it so?

JS For userpage

function save_user()
      {
     const uid = document.getElementById('user_id');
            const userpwd = document.getElementById('user_pwd');
            const btnregister=document.getElementById('btn-action');
            //btnregister.addEventListener('click', e=>
            //{
            const email=uid.value;
            const pass=userpwd.value;
            firebase.auth().signInWithEmailAndPassword(email, pass).catch(function(error) {
    // Handle Errors here.
    var errorCode = error.code;
    console.log(error.Message);

});
firebase.auth().onAuthStateChanged(function(user) {
  if(user) {
    window.location='userpage.html'; 
  }
});

JS

for buy page where firebase.auth().currentUser.uid is showing null code

var fbRef = firebase.database().ref().child("Sell_Products");
    var user = firebase.auth().currentUser.uid; 
alert(user);    /*Here it's showing null
fbRef.on("child_added", snap => {
    var key=snap.key;
    alert('HEllo');
    alert(key);
    var name = snap.child("name").val();
    var price = snap.child("price").val();
    var category = snap.child("category").val();
    var description = snap.child("description").val();
    var image = snap.child("image").val();
    $("#ex-table").append("<tr><td><a href=\"auction.html?itemKey="+key+"\"><img src=" + image + "/img></a></td><td>" + name + "</td><td>" + price + "</td><td>" + category + "</td><td>" + description + "</td></tr>" );
});

Answer 1

The recommended way to obtain the loggedin user is the way you're handling your redirect on userPage (with an observer):

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

source: https://firebase.google.com/docs/auth/web/manage-users

Edit: So you should have something like this:

var fbRef = firebase.database().ref().child("Sell_Products");

firebase.auth().onAuthStateChanged(function(user) {
    if (user) {
        console.log(user);
        var user = firebase.auth().currentUser.uid; 
        alert(user);    //you should have your user here!
        fbRef.on("child_added", snap => {
            var key=snap.key;
            alert('HEllo');
            alert(key);
            var name = snap.child("name").val();
            var price = snap.child("price").val();
            var category = snap.child("category").val();
            var description = snap.child("description").val();
            var image = snap.child("image").val();
            $("#ex-table").append("<tr><td><a href=\"auction.html?itemKey="+key+"\"><img src=" + image + "/img></a></td><td>" + name + "</td><td>" + price + "</td><td>" + category + "</td><td>" + description + "</td></tr>" );
        });
    } else {
        console.log('No user is signed in.');
    }
});

Answer 2

I also encountered such problem. Actually, until the auth is not initialized, it cant show some data but when we use firebase.auth().CurrentUser, it fetches data even before the auth is initialized. You can set a timeout in the code until the auth is completely initialized.

I used this approach to get the data.

const authPromise=()=>{
    return new Promise((resolve,reject)=>{
        const user = firebase.auth().currentUser;
        console.log(user.email)
    })
}

setTimeout(authPromise,2000)