Password protect a page with Firebase

Question

I'm building a CMS with Firebase, but struggling to assess whether what I require is possible, or if I'm missing something.

What I require is the ability to password-protect a page only, and remember that browser as having access. A full user account (using the in built auth) is required to edit the content of the page, but only a password is required to view it.

I know I can use the auth flow with email, but am looking for the editor to be able to create a password for viewing only.

Is this possible, or should I look elsewhere?

Answer 1

The way I commonly do this is a bit like Jeremy's answer, but simpler.

You ask the user for a password when they enter the page, and store that password locally (for reloads).

Then you store data in your database under a path that includes the password. So say that your password is geheim, you could store the data under:

data: {
  geheim: {
    value: "This is the secret value"
  }
}

Now you secure your database with rules like these:

{
  "rules": {
    ".read": false,
    "data": {
      "geheim": {
        ".read": true
      }
    }
  }
}

Now somebody can only read the data at /data/geheim if they know the entire path. So you'll enter the data part in your code, but require them to enter geheim as the password. Then you attach a listener with:

firebase.database().ref("data").child(password).once("value", function(snapshot) {
  console.log(snapshot.val());
});

And if the user entered the correct value for password, this will read the value.