nodeJS - where exactly can I put the Content Security Policy

Asked 10/1, 2014 at 15:34 Answered 24/5, 2020 at 21:13

javascript html node.js content-security-policy

I don't know where to apply the Content Security Policy (CSP) snippet below in my code;

Content-Security-Policy: script-src 'self' https://apis.google.com

Should it be in the HTML?

Will it be best implemented in JavaScript as in the code snippet below?

var policy = "default-src 'self'";
http.createServer(function (req, res) {
    res.writeHead(200, {
        'Content-Security-Policy': policy
    });
});

Inestimable answered 10/1, 2014 at 15:34 Comment(0)

You just need to set it in the HTTP Header, not the HTML. This is a working example with express 4 with a static server:

var express = require('express');
var app = express();


app.use(function(req, res, next) {
    res.setHeader("Content-Security-Policy", "script-src 'self' https://apis.google.com");
    return next();
});

app.use(express.static(__dirname + '/'));

app.listen(process.env.PORT || 3000);

If you want more information about CSP, this is an excelent article: http://www.html5rocks.com/en/tutorials/security/content-security-policy/

Hope that helps!

Wolframite answered 29/5, 2014 at 15:51 Comment(3)

In case this help, here's my Express middleware layer I'm using to set the CSP headers in a way thats easy to update - medium.com/@mdp/csp-in-express-js-node-157d040f2f00 – Scuff 13/10, 2015 at 17:38

When you set the header in node as shown in this answer, does that effect client side js requests to third parties, ie can it block and allow get requests made from the browser to a third party site? or is it only applied to server side js? (also, it seems you can set CSP in the <head> of an html document - content-security-policy.com/examples/meta - but i'm not sure if that is the best approach, in my case, the directives in the <head> section are simply not being applied) – Unmeet 30/8, 2020 at 13:40

Update to answer the question in my comment above - yes, setting CSP headers in the node app effects client side js behaviour as well, as demonstrated in my answer here. – Unmeet 30/8, 2020 at 14:9

For a node.js application without using any external framework e.g. express:

const http = require('http');

http.createServer((request, response) => {

    request.on('error', (err) => {
        console.error(err);

    // for this simple example I am not including the data event
    // e.g. if the request contains data in the body

    }).on('end', () => {

       response.on('error', (err) => {
           console.error(err);
       });

      // you can set your headers with setHeader or 
      // use writeHead as a "shortcut" to include the statusCode. 
      // Note writeHead won't cache results internally
      // and if used in conjuction with setHeader will take some sort of "precedence"

      response.writeHead(200, {
          "Content-Security-Policy": "default-src 'self'"

           // other security headers here...
      });

      response.end("<html><body><h1>Hello, Security Headers!</h1></body></html>");

  });
}).listen(8080);

See the node.js documentation for more details on setting headers on the response object

Syllabub answered 12/8, 2019 at 9:59 Comment(0)

If you are using Express, I suggest taking a look at helmet. In addition to increased options & flexibility (handling CSP violations, nonces...etc), there are a lot of inconsistencies in how browsers implement CSP. Helmet looks at the user-agent of the browser and sets the appropriate header and value for that browser. If no user-agent is matched, it will set all the headers with the 2.0 spec.

// Make sure you run "npm install helmet-csp" to get the csp package.
const csp = require('helmet-csp')

app.use(csp({
  directives: {
    defaultSrc: ["'self'"],
    styleSrc: ["'self'", 'maxcdn.bootstrapcdn.com']
  }
}))

Lanner answered 24/5, 2020 at 21:13 Comment(0)

Recommended topics

Hot tags