0.2.1 • Published 5 years ago
posthtml-nonce v0.2.1
posthtml-nonce
A posthtml plugin create whitelist for specific inline scripts,styles,images,media using a cryptographic nonce
Why?
The HTTP Content-Security-Policy
response header allows web site administrators to control resources the user agent is allowed to load for a given page. With a few exceptions, policies mostly involve specifying server origins and script endpoints. This helps guard against cross-site scripting attacks (XSS).
Used in conjunction with the
middleware
Install
npm i -S posthtml posthtml-nonce
Note: This project is compatible with node v6+
Usage
import {readFileSync, writeFileSync} from 'fs';
import posthtml from 'posthtml';
import posthtmlNonce from 'posthtml-nonce';
const html = readFileSync('input.html', 'utf8');
posthtml()
.use(posthtmlNonce({tags: ['links'], nonce: '4f90d13a42'}))
.process(html)
.then(result => {
writeFileSync('output.html', result.html);
});
Example
input.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<img data-src="logo.svg" alt="">
<script src="script.js"></script>
</body>
<html>
output.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" nonce="4f90d13a42">
</head>
<body>
<img data-src="logo.svg" alt="">
<script src="script.js"></script>
</body>
<html>
will be added nonce attribute with nanoid
Options
tags
Type: Array
(required)
Default: []
Description: You can also expand the list by adding the tags you need...
nanoid
Type: String
(required)
Default:
Description: nanoid