Easily add client-side password-protection to your Single Page Applications and HTML files.
Easily add client-side password-protection to your Single Page Applications and HTML files.
Inspired by MaxLaumeister/PageCrypt, but rewritten to use native Web Crypto API and greatly improve UX + security. Thanks for sharing an excellent starting point to create this tool!
There are 4 different ways to use pagecrypt:
pagecrypt/coreThe encryptHTML() and generatePassword() functions are using Web Crypto API and will thus be able to run in any ESM compatible environment that supports Web Crypto API.
This allows you to use the same pagecrypt API in any environment where you can run modern JavaScript.
encryptHTML(inputHTML: string, password: string): Promise<string>import { encryptHTML } from 'pagecrypt/core'
const inputHTML = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
Secret
</body>
</html>
`
// Encrypt a HTML string and return an encrypted HTML string.
// Write it to a file or send as an HTTPS response.
const encryptedHTML = await encryptHTML(inputHTML, 'password')
generatePassword(length: number): stringimport { generatePassword, encryptHTML } from 'pagecrypt/core'
// Generate a random password without any external dependencies
const password = generatePassword(64)
const encryptedHTML = await encryptHTML(inputHTML, password)
When working in a Node.js environment, you may prefer the pagecrypt Node.js build. This also includes the encrypt() function to read and write directly from and to the file system.
encrypt(inputFile: string, outputFile: string, password: string): Promise<void>import { encrypt } from 'pagecrypt'
// Encrypt a HTML file and write to the filesystem
await encrypt('index.html', 'encrypted.html', 'password')
NOTE: Importing pagecrypt also gives you access to generatePassword() and encryptHTML() from pagecrypt/core.
import { generatePassword, encryptHTML } from 'pagecrypt'
const password = generatePassword(48)
const encrypted = await encryptHTML(inputHTML, password)
Encrypt a single HTML-file with one command:
npx pagecrypt <src> <dest> [password] [options]
Encrypt using a generated password with given length:
npx pagecrypt <src> <dest> -g <length>
Description
Encrypt the <src> HTML file with [password] and save the result in the <dest> HTML file.
Usage
$ pagecrypt <src> <dest> [password] [options]
Options
-g, --generate-password Generate a random password with given length. Must be a number if used.
-v, --version Displays current version
-h, --help Displays this message
Examples
$ pagecrypt index.html encrypted.html password
$ pagecrypt index.html encrypted.html --generate-password 64
$ pagecrypt index.html encrypted.html -g 64
pagecrypt in your build processUse either the pagecrypt Node.js API or the CLI to automatically encrypt the builds for your single page applications.
npm i -D pagecrypt
package.json:
{
"devDependencies": {
"pagecrypt": "^5.0.0"
},
"scripts": {
"build": "...",
"postbuild": "pagecrypt index.html encrypted.html password"
}
}
Project structure:
/web - Web frontend for public webpage (decrypt-template.html). Built using Vite & Tailwind CSS./src/core.ts - pagecrypt core library./src/index.ts - pagecrypt Node.js library./src/cli.ts - pagecrypt CLI./test - simple testing setup./scripts - local scripts for development tasks.npm install in project root.mkcert to generate local certificates to enable HTTPS for the development server. For example mkcert localhost 192.168.1.32 to generate a two files ending with *.pem.vite.config.js to load the generated *.pem files in the https section.npm run serve, also update to the correct *.pem filenames in the npm script.npm test will run basic tests for JS API and CLI. Verify test results by opening the test/out-*.html files in your browser.
Welcome to submit your pull requests!
5.0.0 - 2021-07-15
BREAKING: feature(package): Convert modules to use ESM by default instead of CommonJS. Update your build tool to use import syntax instead of require - or keep using pagecrypt@^4.0.1 which supports CommonJS require.
feature(package): Add a new pagecrypt/core module that can be imported to use the core library features in browsers, Deno and any other ESM compatible modern JS environment. For Node.js, the index import pagecrypt still works just like before.
feature(types): Add TypeScript definitions to improve DX and automation in TypeScript projects.
feature(crypto): Use isomorphic Web Crypto API to allow code reuse between Node.js, browsers and other ESM compatible environments.
feature(password generator): Use the isomorphic Web Crypto API to make project run in Node.js, browsers and other ESM compatible environments.
feature(build): Improve package build setup using esbuild and node-fs-extra
FAQs
Easily add client-side password-protection to your Single Page Applications and HTML files.
The npm package pagecrypt receives a total of 603 weekly downloads. As such, pagecrypt popularity was classified as not popular.
We found that pagecrypt demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
An advanced npm supply chain attack is leveraging Ethereum smart contracts for decentralized, persistent malware control, evading traditional defenses.
Security News
Research
Attackers are impersonating Sindre Sorhus on npm with a fake 'chalk-node' package containing a malicious backdoor to compromise developers' projects.
Security News
The npm package for the LottieFiles Player web component was hit with a supply chain attack after a software engineer's npmjs credentials were compromised.