Implementing a content security policy with Jekyll

Question

My content security policy is the following:

Content-Security-Policy: default-src 'self' https://fonts.googleapis.com https://ajax.googleapis.com; script-src 'self' https://fonts.googleapis.com https://ajax.googleapis.com; style-src 'self' https://fonts.googleapis.com; img-src 'self' ; font-src 'self' https://fonts.googleapis.com; connect-src 'self' https://ajax.googleapis.com; media-src 'self' ; object-src 'self' ; child-src 'self' ; frame-ancestors 'self' ; form-action 'none' ; sandbox allow-same-origin allow-scripts allow-pointer-lock;

You can partially implement it with meta http-equiv, but it does not allow you frame ancestors and sandboxing, from what I understand. You need to send a http header. However, my web host does not allow php commands coming from HTML files and I would like to avoid it anyway.

Long story short, what are my options to implement this policy while using Jekyll as a generator?

Answer 1

To test locally, you can specify custom headers with Jekyll. In your _config.yml add :

# Custom headers
webrick:
  headers:
    Content-Security-Policy: default-src 'none'; script-src 'self'; connect-src 'self'; img-src 'self'; style-src 'self'; 
    My-Other-Header: My-Other-Value

source: https://jekyllrb.com/docs/configuration/#custom-webrick-headers

Answer 2

It sounds like you've quasi-answered your own question, but you may not like the answer. Jekyll is simply a static HTML generation tool. It doesn't have the ability to do anything besides generate HTML which includes inline HTML headers.

If you don't have access to the web server (nginx, apache, passenger standalone, etc.) and as such can't write your headers from your server configuration file, then you'll have to find a way to generate the appropriate headers in your Jekyll template.

You should be able to set custom headers by setting the http-equiv properly in your Jekyll layout file (probably _layouts/default.html). Adding the following to this file should help your http-equiv CSP meta tag be included in all HTML pages generated by Jekyll with the default layout:

<meta http-equiv="X-Content-Security-Policy" content="default-src 'self' https://fonts.googleapis.com https://ajax.googleapis.com; script-src 'self' https://fonts.googleapis.com https://ajax.googleapis.com; style-src 'self' https://fonts.googleapis.com; img-src 'self' ; font-src 'self' https://fonts.googleapis.com; connect-src 'self' https://ajax.googleapis.com; media-src 'self' ; object-src 'self' ; child-src 'self' ; frame-ancestors 'self' ; form-action 'none' ; sandbox allow-same-origin allow-scripts allow-pointer-lock;" />

PS - I realize this doesn't address the frame-ancestors piece you mentioned. Unfortunately I don't know the answer to that besides working with your web host provider to see if you can get them to insert your CSP header into your site configuration somehow.