I'm creating a web application using Firebase as the backend for data storage, real-time updates, as well as for hosting.
Moving most things client-side is pretty slick, but the issue of security is an important one to address.
For access to data on Firebase, Firebase Security Rules takes care of most things. But, when using Firebase for hosting, I feel like there is a lack of security for accessing certain routes.
Currently, on a page load, I can check to see whether or not a user is logged in. If the user isn't logged in (or if the auth token isn't valid) I can redirect the user to a different page (i.e. a Login page). But, my issue is what if there is information embedded in the static html on that page that I wouldn't want an unauthorized user to see?
I feel like the first answer that I'll receive is, "The data should be kept in a Firebase variable and loaded only if the authorization is successful." While that is a valid option, I'm thinking storage of HTML (or even just paragraphs of text) as a Firebase variable is kludgy, and there ought to be a better way.
Initially I thought that this would be an inherent option in the firebase.json
file, as one can define redirects, headers, etc. But, there is nothing in firebase.json
for security (like in firebase-security.json
) that would allow me perform an auth
check such as the following:
{
"firebase": "myfirebase",
"public": "app",
"ignore": [],
"rules": "config/security-rules.json",
"routes": [ {
"source" : "/for_authorized_only/",
"destination": "/authorized_page.html",
"auth": true, //Must be authorized
}, {
"source": "/some_public_route",
"destination": "index.html",
"auth": false, //No auth required to access this page
} ]
}
I haven't tried out AngularJS or AngularFire, but after searching a little it seems like the angularFire-seed project includes route security, however this should be included in Firebase rather than rely on another framework!
Is there something that I'm looking over that would allow me to accomplish this?