Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/macedigital/gulp-sri-hash
Gulp plugin for adding Sub-Resource-Integrity (SRI) hashes in-place to asset links found in HTML files.
https://github.com/macedigital/gulp-sri-hash
gulp-plugin sri subresource-integrity
Last synced: about 2 months ago
JSON representation
Gulp plugin for adding Sub-Resource-Integrity (SRI) hashes in-place to asset links found in HTML files.
- Host: GitHub
- URL: https://github.com/macedigital/gulp-sri-hash
- Owner: macedigital
- License: mit
- Created: 2016-09-05T11:23:58.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2022-12-30T17:33:23.000Z (almost 2 years ago)
- Last Synced: 2024-10-27T07:32:25.795Z (about 2 months ago)
- Topics: gulp-plugin, sri, subresource-integrity
- Language: JavaScript
- Size: 802 KB
- Stars: 17
- Watchers: 2
- Forks: 1
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# gulp-sri-hash
[](https://greenkeeper.io/)
[![NPM Version][npm-image]][npm-url]
[![Dependency Status][deps-image]][deps-url]
[![Build Status][ci-image]][ci-url]
[![Build Status][appveyor-image]][appveyor-url]
[![Code Coverage status][codecov-image]][codecov-url]
Adds [Subresource Integrity (SRI)](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity) hashes to HTML files.
It does so, by parsing the contents of passed in HTML files with [cheerio](https://github.com/cheeriojs/cheerio), looking for `` and `` DOM-nodes, computing checksums for found referenced files, and adding `integrity=<HASH>` attributes in-place to respective DOM-nodes.
Inspiration for this plugin came from working with static site generators.
For an alternative approach, have a look at the [gulp-sri](https://github.com/mathisonian/gulp-sri) plugin.
## Installation
Install package with NPM and add it to your development dependencies:
```text
npm install gulp-sri-hash --save-dev
```
## Usage
```js
const sriHash = require('gulp-sri-hash');
gulp.task('sri', () => {
return gulp.src('./**/*.html')
// do not modify contents of any referenced css- and js-files after this task...
.pipe(sriHash())
// ... manipulating html files further, is perfectly fine
.pipe(gulp.dest('./dist/'));
});
```
This will look for css and js file references contained in all html-files, calculate SRI-hashes for those files, and add `integrity=<HASH>` attributes for those references.
Referenced css- and js-files must be accessible from the local filesystem. In order to calculate correct hashes, style and script files should not be modified any further by build steps running later.
**Line Endings:**
Content hashing is sensitive to differences in line-endings. On Windows, the default is `CRLF`, whereas (all?) other Operating Systems default to `LF`.
You're good, as long the files use the same end-of-line sequence locally as well as on the server that delivers those asset files.
On the other hand, a change of line-endings after content hashing will cause a [file checksum mismatch](https://github.com/macedigital/gulp-sri-hash/issues/6).
## API
### algo (optional)
* Type: `String`
* Default: `sha384`
* Since: *v1.0.0*
Select hashing algorithm. Supported algorithms: `sha256`, `sha384`, and `sha512`.
### prefix (optional)
* Type: `String`
* Default: `''`
* Since: *v1.1.0*
Strips string from beginning of referenced URI in HTML files. Useful if references do not match directory structure or already contain CDN hostname.
### selector (optional)
* Type: `String`
* Default: `link[href][rel=stylesheet]:not([integrity]), script[src]:not([integrity])`
* Since: *v1.1.0*
Only look for nodes matching this custom (jQuery-style) selector.
### relative (optional)
* Type: `Boolean`
* Default: `false`
* Since: *v1.2.0*
Controls whether referenced files should be resolved relative to a base folder, or relative to the location of the HTML file.
Inspired by <https://github.com/macedigital/gulp-sri-hash/pull/1>.
### cacheParser (optional)
* Type: `Boolean`
* Default: `false`
* Since: *v2.2.0*
Controls whether to permit cached cheerio instances, e.g. when using [gulp-cheerio][gulp-cheerio-url] in a previous build step. Be careful when enabling this feature as it can have unintended side-effects.
## Example
Following snippet shows all options in action:
```js
// ...
.pipe(sriHash({
algo: 'sha512', // use strong hashing
prefix: '/assets', // no trailing slash
selector: 'link[href]', // limit selector
relative: true // assets reside relative to html file
}))
// ...
```
## Changelog
*Since v2.0.0:*
Require a peer-dependency of gulp 4.x and drop support for nodejs 4.x which reached its [End-of-Life on April 30th 2018](https://medium.com/@nodejs/april-2018-release-updates-from-the-node-js-project-71687e1f7742).
*Since v1.4.0:*
Querystring-like components in file paths are ignored when resolving local files. As an example, the given string `/folder/style.css?v=somehash` will resolve to local file `/folder/style.css`.
*Since v1.3.0:*
A `crossorigin=anonymous` attribute will be added to all updated DOM nodes, unless the attribute has been already been set to value `use-credentials`. In the latter case the `crossorigin` attribute is left unchanged.
## LICENSE
MIT License
[npm-image]:https://img.shields.io/npm/v/gulp-sri-hash.svg?style=flat
[npm-url]:https://www.npmjs.com/package/gulp-sri-hash
[deps-image]:https://img.shields.io/david/macedigital/gulp-sri-hash.svg
[deps-url]:https://david-dm.org/macedigital/gulp-sri-hash
[ci-image]: https://img.shields.io/travis/macedigital/gulp-sri-hash/master.svg
[ci-url]: https://travis-ci.org/macedigital/gulp-sri-hash
[codecov-image]:https://img.shields.io/codecov/c/github/macedigital/gulp-sri-hash.svg?style=flat
[codecov-url]:https://codecov.io/github/macedigital/gulp-sri-hash
[appveyor-image]:https://ci.appveyor.com/api/projects/status/in9jtvifuxc0ct9w?svg=true
[appveyor-url]:https://ci.appveyor.com/project/macedigital/gulp-sri-hash
[gulp-cheerio-url]: https://www.npmjs.com/package/gulp-cheerio