Authentication for firebase hosting

You can do this using Firebase Functions, and an Express call. Put all of your static files into a folder named functions/admin and put this function into functions/index.js:

exports.admin = functions.https.onRequest((req, res) => {
  const url = req.originalUrl ? req.originalUrl : '/index.html'  // default to index.html
  res.sendfile('admin' + url)
})

Then, a request to your functions server for /admin/* will serve up the file of the same name.

If you want to add authorization, try this:

exports.admin = functions.https.onRequest(async (req, res) => {
  const url = req.originalUrl ? req.originalUrl : '/index.html'
  const user = await get_user(req)  // get the current user
  if (user && user.is_admin)        // is current user an admin?
    res.sendfile('admin' + url)
  else {
    res.status(403).send(null)
  }
})

You will have to define get_user() so it returns a user object with an is_admin field.


Firebase Hosting provides no way to limit access to the static resources (HTML, CSS, JavaScript) of your site. See Can Firebase hosting restrict access to resources?, Firebase Hosting - Members Only / Secured Webpages?.

But if your site serves dynamic content (e.g. loads data from the Firebase Database from JavaScript, or uploads images to Firebase Storage) you can use Firebase Authentication plus the server-side security rules (database, storage) of those products to ensure users can only take actions they're authorized for.