Skip to content

Instantly share code, notes, and snippets.

@j0hnm4r5
Created March 7, 2019 02:55
Show Gist options
  • Save j0hnm4r5/a9e2361e56226a1f357bb346292f9021 to your computer and use it in GitHub Desktop.
Save j0hnm4r5/a9e2361e56226a1f357bb346292f9021 to your computer and use it in GitHub Desktop.
Netlify Free Password Protection
{
...,
"scripts": {
"start": "gatsby develop -p 1234 -H 0.0.0.0",
"publish": "npm run _clean && npm run _build && npm run _encrypt && npm run _envDeploy",
"//": "========= PRIVATE SCRIPTS =========",
"_clean": "gatsby clean",
"_build": "gatsby build",
"_encrypt": "npx staticrypt public/index.html P@55W0RD -o public/index.html",
"_deploy": "npx netlify-cli deploy --dir=public --prod",
"_envDeploy": "NETLIFY_SITE_ID=abc-defg-hijk-lmnop NETLIFY_AUTH_TOKEN=abcdefg0123456789 bash -c 'npm run _deploy'"
},
...,
}
@888ba8
Copy link

888ba8 commented Dec 2, 2020

Hi,

I am using the following Gatsby template https://jamtemplates.com/templates/gatsby-yellowcake and Deployed it to netlify via a private Gitlab repository.

I am using the following tutorial https://medium.com/@j0hnm4r5/password-protecting-a-website-with-the-free-tier-of-netlify-and-publishing-with-a-single-npm-e509af9f108f to password protect a single file public/index.html

and it works great.

What I did was I replace whatever was in my package.json "scripts": { by what the tutorial mentions.

Then I changed my netlify.toml command to command = "npm run publish"

and under https://app.netlify.com/sites/elements-development/settings/deploys I also changed the build command to npm publish

However, how can I password protect each individual page / the whole website please?

Kind regards,

888

@Blattinum
Copy link

Cool! So, in theory, I should be able to do this with a VueJS site?

@daniel-beranek
Copy link

For those not using Gatsby.

The way it works is you provide your html file, run staticrypt on it and get a new html file with password prompt and encrypted content from the original html you provided.

This essentialy means you just need to run this command: npx staticrypt path-to-your-file/your-file.html -p <your-password>

In default it will create the new file in a folder named encrypted and this is the file you will want to host on netlify or any other platform.

You can find more info plus other command options here: https://www.npmjs.com/package/staticrypt

Wish you all the best!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment