A while back, I posted how I add HTTP response headers to my Workers on high-performance pages. This was inspired by Scott Helme’s blog post on using Workers to set headers. As that post is nearly four years old, things have come a long way since then.
Why Are These Response Headers Important?
Basic HTTP response headers assume there are no security threats to your website. For example, here is a SecurityHeaders report on a basic site:
It is an HTTP URL because the site does not support HTTPS. Though I do not know if this site owner is aware of their “F” rating, I doubt they care since they don’t even use HTTPS. Troy Hunt explains why all sites need HTTPS.
If this site owner was using Cloudflare, they could download an Origin CA Certificate for their proxied site and fix every single one of those Headers warnings:
- CSP tells a browser what it is and is not allowed to load, and from where.
- X-Frame-Options can stop other people from framing your content into their website.
- X-Content-Type-Options can force a browser to treat a resource the way you have declared it.
- Referrer-Policy lets you decide how a browser reports your website to any site you link to.
- Permissions-Policy replaces Feature-Policy as a way to ensure that nothing in your site triggers unwanted behavior in the browser.
- The SecurityHeaders website goes into more detail about all of this.
The Hard Way
There is an old blog post from Scott Helme on one way to add these headers at the origin. I have used similar approaches on Apache, NGINX and OpenLiteSpeed. They all involve modifying files on the server. And, quite often, requiring a reload of your site’s config files.
Scott Helme’s blog post on Workers is how I did it more recently. His post feels like it was just yesterday, but it has been four years. I mention Scott not just because he has an awesome first name, but because he is one of the world’s foremost experts on website security, trusted by Troy Hunt and Ivan Ristic to lead their respective courses.
The Easy Way to Add Response Headers
One month ago, Cloudflare announced a new and easy way to modify response headers. This is a great improvement because it is handled in one place, is independent of server configuration which makes it follow the proxied site, no matter where it is hosted, and does not require reloading config files in the server.
If you take a look at Scott Helme’s Worker, you will see three sections:
- Additions
- Replacements
- Removals
What is even better about Cloudflare’s new Transform Rules, it’s easy to set different response headers for different parts of your website. For example, Admin actions require a more lenient CSP than the public facing site. So I set one rule to match the site, but exclude the admin path:
Match hostname of main site, but does not contain "admin".
From the Header Warnings list above, CSP is the most difficult part, but Scott Helme’s Worker provides an excellent boilerplate beginning:
- Content-Security-Policy: upgrade-insecure-requests; (fixes Mixed Content Errors on HTTPS connection)
- Permissions-Policy: interest-cohort=() (I start with this directive to block FLoC tracking)
- Referrer-Policy: same-origin (this stops browsers from telling other sites I link to where the visitor came from)
- Strict-Transport-Security (You can disregard this because Cloudflare can set this natively)
- X-Content-Type-Options: nosniff (Stops browsers from ignoring your content settings)
- X-Frame-Options: SAMEORIGIN (only my site is allowed to frame itself)
- X-Xss-Protection: 1; mode=block (stops external scripts from running)
I also remove several headers. Mostly ones set by Cloudflare that I would rather not include:
- “Expect-CT”, “nel”, and “Report-To”. This can quite down browser activity I do not want.
- X-Redirect-By. WordPress will use this if it is redirecting to the canonical URL.
- Any of the headers that OpenLiteSpeed includes for self-promotion, similar to X-Powered-By.
Check Your Work
An earlier post of mine links to three websites good for viewing and testing these headers. While Hardenize and SecurityHeaders give a general score on CSP, Observatory really digs into the policy for any problems. However, CSP is a separate topic with many resources already dedicated to cleaning that up.