hash-csp

Stream that takes vinyl files (like those generated by gulp.src) and generates hashes for contained inline scripts.

This plugin is meant as part of a development toolchain.

If you've ever seen this:

then you know you have a problem.

If you're developing on Chrome extensions then there's not much you can do prior to Chrome 45, but in 46 plus it supports hashing for inline scripts.

Chrome doesn't appear to support the meta tag for setting CSP in background/popup pages, so you'll need to augment your manifest csp declaration.

You should be filtering what files you pass in to this, some configuration may come later.

Note that in order for the CSP set in the manifest of a chrome extension to take effect it requires an extension reload.

Example:

var gulp = require('gulp');
var mainBowerFiles = require('main-bower-files');
var hashstream = require('hash-csp');
var jeditor = require('gulp-json-editor');

var dest = 'dist';
var manifest = 'manifest.json';
gulp.src(mainBowerFiles())
    .pipe(gulp.dest(dest))
    .pipe(hashstream((hashes) => {
      // map to format
      var csp_fragment = hashes.map(h => `'${h}'`).join(" ");
      // make csp node
      var csp = `script-src 'self' 'unsafe-eval' ${shas}; object-src 'self'`;
      gulp.src(manifest)
          .pipe(jeditor({
            content_security_policy: csp
          }))
          .pipe(gulp.dest(dest));
    }));