Password protection for a single html page

Hi! I am using jekyll build, using liquid template, have my files on github repository and using netlify free plan currently to host my website. I want to put a password for a single project page (single html) since that projects deal with confidential contents. Is it possible to do this with a free plan or do I need a pro plan to do this?

This post would be better suited in the support category, can you change that for me :slight_smile:

If I am correct in what you are trying to do then, yes! This is absolutely possible with Role-based access control with JWT | Netlify Docs

Can you just be extra specific on what you are trying to protect, when you mention “Single project page” do you mean just a simple page in the site or a separate site altogether.

Feel free to ask about how you would go about using Role based redirects if you are unsure after reading the docs

Kyle.

Hello Kyle.

Excuse me with me being not specific! And I changed the category from Features to Support as you advised, thanks.

What I want to do is to put a password to the post.html file which draws its content from markdown files from the /_posts/ directory.Screenshot 2021-01-26 at 21.06.43
Within these 5 markdown files, I only want to put a password on the html file when it draws its content from the last markdown file.

Hey there @jooy :wave:t2:

Welcome to The Community :netliheart:

Getting involved with Netlify Identity and Role Based Access Control (RBAC) can be extensive and tricky — I wonder if it may just be too big a fish for your particular use case! I’d recommend looking into just using HTTP Basic Auth in the _headers file. This essentially allows you to define paths on your site and set one/many usernames and passwords that prompt users to enter the correct credentials to view that/those paths. There’s no fancy login page and no styling, it just uses a browser’s built-in Basic Auth login system, but it works great with very little setup.

One note here — I don’t know if this feature is actually available on free-tier accounts. Netlify Identity and RBAC is, but I’m not sure if this simple HTTP Auth via _headers is. I have an elevated account so I wouldn’t actually be able to tell myself. It seems pretty simple to setup so I’d say give it a go and see if it works!

Hope that helps!


Jon

1 Like

Unfortunately @jonsully, HTTP Auth is not available on the free plan.

I’d be more than happy to walk @jooy through setting up a simple role based redirect.

Hi.

May I ask you what you mean by ‘setting up a simple role based redirect’? Excuse me for not understanding it well. I am not a professional developer and am also quite new to Netlify…!

No worries! Of course I’ll explain it thoroughly to you. If there is any terminology I mention that you don’t understand make sure to let me know.

Simply put, role based redirects mean:

  1. A user signs up to your identity gateway or is invited by your through the UI.

  2. They are assigned role(s) - for example admin or editor

  3. Then what we can do is limit specific pages in our site to a specific role or multiple roles even.

So lets say that we want users with the role of admin to access the admin page in our site. This is how we would go about it:

In our netlify.toml file in the root of our site we can use a boilerplate like this:

[[redirects]]
from = "/admin/*"
force = true
status = 200
conditions = {Role = ["admin"]}

[[redirects]]
from = "/admin/*"
to = "/"
force = true
status = 302

This specific rule tells Netlify to only allow users with the roles of admin to access the page admin or any of its sub pages.

Kyle.

If your target audience is not generally going to disable JS, you can use JS for this.

You can do something like, set a value in localstorage and check for that when the page loads. If the value doesn’t exist, you redirect back to previous page. Not very secure, but gets the job done.

A little more security can be gained by using Firebase authentication, but even that is JS based. But if using JS is not possible, the RBAC is the only option for free tier.

1 Like