Development > Web

123outerme's Minor Firebase Projects

(1/1)

123outerme:
Recently I have started to learn how to user Firebase, thanks to exposure from @_iPhoenix_ . I created a test website, which I have been developing on here. I've added a login/out button, file upload and download, and database read/write (demonstrated by the "load files" button). I intend to add more features to the test website before I call it complete, but know that some pretty cool websites will most likely begin development after this testing phase :)

123outerme:
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.

--- Code: ---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);
  }
}

--- End code ---

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: ---firebase.auth().setPersistence(firebase.auth.Auth.Persistence.SESSION).then(function() {
console.log("Persistence set");
}).catch(function(error) {
console.log(error);
});

--- End code ---

Navigation

[0] Message Index

Go to full version