How to stop users from accessing other pages without login permission in Firebase Auth

by

I have a website that has multiple pages and uses Firebase as backend. I’ve already implemented firebase auth for the login and I have knowledge of using onAuthChangeState. The problem is now I am trying to find a way to stop the users from accessing other pages without the login page. I want to have some kind of like a "session or token" in php that acts as a key in order for the user to access the page. NOTE! I did not use php because I am also using firebase as a means for hosting my site. BTW Most of the sources I saw only uses a single page and uses a lot of style.display = "none or block", I don’t want to go this route, As I like to be more organized and have a proper management in terms of code segregation. That is why I have multiple pages eg; Login.html, Page2.html.

I know how to use javascript redirect

firebase.auth().onAuthStateChanged(firebaseUser => {
    if(firebaseUser){
        window.location.href = "page2.html";
    }else{
        window.location.href = "page1.html";
    }
});

But the user might just type https://mysite.firebaseapp.com/page2.html
and access it. Which is what I am trying to prevent.

82 thoughts on “How to stop users from accessing other pages without login permission in Firebase Auth”

Leave a Comment