tbassetto/README.md Secret

## README.md

      
    Raw
  

              README.md
            
          
    How to reproduce the bug


Save locally index.html and server.js from this gist or download the files.
In the same folder, run npm install browser-sync helmet-csp.
Run node server.js and open http://localhost:3000.
Make some modifications to index.html and manually reload the web page.
Have a look at the CSP header, it contains -Only-Report multiple times!


## index.html
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Browser Sync + Helmet CSP bug</title>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
  </head>
  <body>
    <p>This page violates the CSP Policy by loading an external script and because it is served by Browser Sync which inject inline scripts, an external script and use Web Sockets!</p>
    <p>The violation will be reported to <code>/report-violation</code>.</p>
  </body>
</html>

## server.js
var browserSync = require('browser-sync');
var contentSecurityPolicy = require('helmet-csp')

var options = {
  open: false,
  server: {
    baseDir: '.',
    middleware: [
      {
        route: '/report-violation',
        handle: function (req, res, next) {
          if (req.method === 'POST') {
            var chunks = '';
            req.on('data', function(chunk) {
              chunks = chunks + chunk;
            });
            req.on('end', function() {
              // do something with chunks
              res.writeHead(200, {'Content-Type': 'text/html'});
              res.end();
            });
          } else {
            next();
          }
        }
      },
      contentSecurityPolicy({
        reportOnly: true,
        browserSniff: false,
        directives: {
          defaultSrc: [],
          scriptSrc: ["'self'", 'unsafe-inline'],
          styleSrc: [],
          reportUri: '/report-violation'
        }
      })
    ]
  }
};

browserSync(options);
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Browser Sync + Helmet CSP bug</title>
	<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
	</head>
	<body>
	<p>This page violates the CSP Policy by loading an external script and because it is served by Browser Sync which inject inline scripts, an external script and use Web Sockets!</p>
	<p>The violation will be reported to <code>/report-violation</code>.</p>
	</body>
	</html>
	var browserSync = require('browser-sync');
	var contentSecurityPolicy = require('helmet-csp')

	var options = {
	open: false,
	server: {
	baseDir: '.',
	middleware: [
	{
	route: '/report-violation',
	handle: function (req, res, next) {
	if (req.method === 'POST') {
	var chunks = '';
	req.on('data', function(chunk) {
	chunks = chunks + chunk;
	});
	req.on('end', function() {
	// do something with chunks
	res.writeHead(200, {'Content-Type': 'text/html'});
	res.end();
	});
	} else {
	next();
	}
	}
	},
	contentSecurityPolicy({
	reportOnly: true,
	browserSniff: false,
	directives: {
	defaultSrc: [],
	scriptSrc: ["'self'", 'unsafe-inline'],
	styleSrc: [],
	reportUri: '/report-violation'
	}
	})
	]
	}
	};

	browserSync(options);