Recently, I had trouble with login/out. When I logged out and refreshed, the user wouldn't stay logged out. When you logged into a different account, sometimes the user who was previously logged in would be the one who was logged in, when refreshing. Essentially, the user would be "remembered" and not allowed to change, even upon forcing a log out. This is the login.js file I used to control auth. gLogin() is called when the user presses Login, gLogout() is called when the user presses Logout, and that's about it.
Eventually, I figured it out: Apparently, the issue was that I didn't set a default auth persistence state. From what I understand, this meant that persistence would have undocumented behavior. Here's what I added to each of my pages' scripts:
Code Select
var signedIn;
var curUser = null;
function updateUser(user)
{
if (user !== null) {
curUser = user;
signedIn = true;
console.log("User is logged in");
// User is signed in.
} else {
curUser = null;
signedIn = false;
console.log("User is not logged in");
// No user is signed in.
}
setButtons(signedIn);
}
firebase.auth().onAuthStateChanged(function(user) {
console.log(user);
updateUser(user);
});
function gLogin() {
firebase.auth().signInWithPopup(gProvider).then(function (result) {
// This gives you a Google Access Token. You can use it to access the Google API.
var token = result.credential.accessToken;
// The signed-in user info.
curUser = result.user;
signedIn = true;
//location.reload(true);
updateUser(curUser);
//setButtons(signedIn);
}).catch(function (error) {
console.log(error);
var errorCode = error.code;
var errorMessage = error.message;
// The email of the user's account used.
var email = error.email;
// The firebase.auth.AuthCredential type that was used.
var credential = error.credential;
// ...
});
}
function gLogout() {
firebase.auth().signOut().then(function () {
signedIn = false;
updateUser(null);
location.reload();
//setButtons(signedIn);
}).catch(function (error) {
console.log(error);
});
}
function setButtons(loggedIn) {
var stylesheet = getStylesheet("visibility");
if (loggedIn) {
document.getElementById("signin").setAttribute("style", "display: none;");
document.getElementById("signout").setAttribute("style", "display: block;");
document.getElementById("signoutButton").innerHTML = "Logout, " + curUser.displayName;
stylesheet.deleteRule(0);
stylesheet.insertRule(".signedin { display: block; }", 0);
} else {
document.getElementById("signin").setAttribute("style", "display: block;");
document.getElementById("signout").setAttribute("style", "display: none;");
stylesheet.deleteRule(0);
stylesheet.insertRule(".signedin { display: none; }", 0);
}
}
Eventually, I figured it out: Apparently, the issue was that I didn't set a default auth persistence state. From what I understand, this meant that persistence would have undocumented behavior. Here's what I added to each of my pages' scripts:
Code Select
firebase.auth().setPersistence(firebase.auth.Auth.Persistence.SESSION).then(function() {
console.log("Persistence set");
}).catch(function(error) {
console.log(error);
});
