How to gate content behind Pages


I am building a website using Pages and I need to “shield” specific areas behind a user system. After researching a bit this does not seem possible yet, or am I missing something?

Looking at Netlify they offer this “Identity” service which essentially checks every page inside the _redirects file for a JWT token before rendering it.

Considering you would have a KV store with users, can this be achieved with Pages?

Please advise, many thanks!

You can do it, but you pretty much have to roll your own code for it. I have looked quite a lot for an off-the-shelf solution and none seem to exist that are really suitable and general-purpose.

I find this frustrating because security code is something where rolling your own is almost always a bad idea, but it seems to be what everyone is doing at this point.

I see. Well I am happy to do it on my own… but the question is how?! I just cannot comprehend how you can gate content behind pages without a worker or something…

Ah. Functions is what you’re looking for. Functions are like Workers but you deploy them right in your Pages project, and use the filesystem path as the routing. So you can create a Function under /admin/ that will run on every request to that URL.

Then you have to friggin’ roll your own auth code, which sucks, and you ask a simple question on Reddit and everyone there shames you for not just writing it your own self. There’s a business opportunity here. Just saying. :joy:

Thanks, I know about Functions… checkout my blog fully written with Pages: [ MECANIK DEV ]. It’s not a good solution at all if you think about it… because usually what happens is this:

  1. User logs in, API returns a JWT token or cookie
  2. User navigates to /user/ and it should present the token - somehow -
  3. Functions would check this token and either allow the request / either return him back to the login page

The culprit is at number 2. - how do you “present” your token… since Pages is a static site, you would need to either use cookies or make ajax calls… so from my opinion not a good solution.

Netlify’s solution is much better because they check the token themselves and offer you ready to use libraries for it.

On another note, there is this: GitHub - cloudflare/production-saas: (WIP) Example SaaS application built in public on the Cloudflare stack! which looks really interesting, but again same issue.

Regarding Reddit, they are much nicer than on Discord. I got banned and kicked out from Discord for simply pointing out a problem with wrangler.

You may be misunderstanding Functions. You can have a Function that runs in front of a static page. You can even have a Function that runs for every request under a certain directory.

You’re not choosing “this URL can either have a Function or a static page”. You can have a Function that runs and then returns a static page. You can have a Function that, for example, returns a modified version of a static page, for server-side rendering. You can create a static page with a few placeholders and have a Function that sits in front of it and returns the page with a few modifications.

You can, for the purpose of what we’re talking about, have a Function that runs in front of every request to /admin/, checks the auth, and then either returns the static page or returns an “access denied” page.

It’s just that you have to write it yourself. That’s the thing. And adding insult to injury, anyone you ask about this tells you to just write it yourself. I mean, I am perfectly capable of writing an authentication system, but that’s not interesting to me, and therefore I shouldn’t do it because I should use well-vetted code written by experts who spend their time thinking about this sort of thing. This should be a solved problem and it’s not.

I think you misunderstood me. I know and understand very well what you are saying about Functions.

My problem is the session. Once you logged in, you can get a token / or set a cookie (hate the cookie part). So now that you are logged in, you have a token. How do you “present” it in the request headers so that your Functions can validate it? :slight_smile:

Oh. Yes. If you have a JWT, suddenly you need code to deal with it on the server side and on the client side. Your server-side has to deal with it. It’s not like back in the day when you used HTTP Basic Auth and Apache just dealt with it. You could enable modules that let you do auth against the password file, or an SQL database, or a flat file. It was Wonderful.

But HTTP Basic Auth didn’t present a UI that the website could control, so the Internet, it all its wisdom, rejected it. No one uses it any more. It was a zero-effort auth UI and no one uses it any more because it’s not cool. Because you can’t control your login page.

So now, you have to deal with auth by yourself, because The Internet decided that a browser-controlled login system just can’t be the thing.

You’re doing a static site, but suddenly you need to “present” something that you can only “present” if you’re also running client-side code. So you go ask on Reddit and everyone is like “just write it, loser.”

The Web is the worst app platform, except for all the others.

Oh, don’t even get me started on such subjects. Back to the problem at hand…

  1. We can register and login users via Functions, but the only thing we can do is return a token.
  2. We can use this token and validate it in every request to /admin/*, either via header authorization either via cookies.
  3. What we cannot do is present the headers from a static page, which means we need to set a cookie and use the cookie method.

Am I missing something?

After checking, it seems I was right. Once you are “logged in” you set the cookie with the token and then validate it upon request. Oh well.

Ohhhhh. Okay. Yeah. Netlify has some better products available in terms of user auth.

In Cloudflare Pages the only way to cover a URL space with authentication is to do it yourself, or do do it with Cloudflare Access, which works great but may not be what you’re looking for if what you want is random end-user auth and not “people in my organization” auth.

So I’m going to risk my Trust Level here and say that Cloudflare may not be the thing you’re looking for. They just don’t have the product you’re looking for.

Well… indeed I could just use Netflify. But realistically, it would cost a lot compared to CF and CF has many other services which Netflify does not.

With that being said, I’l create an auth system myself. Do you want to join? :smiley: