Check out this JavaScript code snippet:
var input = document.getElementById("password_field");
input.addEventListener("keyup", function(event) {
if (event.keyCode === 13) {
event.preventDefault();
document.getElementById("login").click();
}
});
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
document.getElementById("user_div").style.display = "block";
document.getElementById("login_div").style.display = "none";
var currentUser = firebase.auth().currentUser;
if(currentUser != null) {
var emailId = currentUser.email;
var isEmailVerified = currentUser.emailVerified;
document.getElementById('user_para').innerHTML = "You are logged in as<strong> " + emailId + "</strong>.";
if (isEmailVerified === false) {
document.getElementById('user_verified').innerHTML = "<strong>You are not verified. Please check for an email from perason for a verification link. You will not be able to access anything without verification.";
} else {
document.getElementById('user_verified').innerHTML = "";
document.getElementById('sandboxaccess').style.display = "block";
}
}
} else {
document.getElementById("user_div").style.display = "none";
document.getElementById("login_div").style.display = "block";
}
});
function loginUser() {
var userEmail = document.getElementById('email_field').value;
var userPass = document.getElementById('password_field').value;
firebase.auth().signInWithEmailAndPassword(userEmail, userPass).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
window.alert("Error: " + errorMessage);
});
}
function logoutUser() {
firebase.auth().signOut();
}
The script functions correctly at first, but upon page refresh, the JavaScript functionality ceases. Interestingly, it works fine on Apache localhost even after refreshing. How can this issue be resolved?
Snapshot before refresh:
Snapshot after refresh:
Note that the logout button appears in both snapshots.