CSP on Digital Gardens

If you followed my guide on How to host a Digital Garden on Cloudflare you may have noticed when you run the header security scan that you'll get warnings about a missing "Content Security Policy (CSP)".

I can hear you screaming at me through your browsers "Max you JERK, HOW could you have led me astray?!?" Instead, you should thank me for sparing you from the madness that is CSP and Digital Garden.

Digital Garden completely breaks when it comes to CSP

  1. There are tons of on-page scripts make it effectively impossible to implement.
  2. Additionally, there are tons of remotely-hosted scripts, and literally nothing I tried has worked.

Feel free to experiment with something like Csper, though it's going to require constant maintenance whenever there's an update[1]

For reference, here was my "CSP" policy after several rounds (see version=5 at the end, but I only started counting when I experimented with Csper). Just adding the domain that hosted the scrips should have worked, without spelling out the specific scripts[2], but I just could not get it working.
How this site was made-19.png

If you use Csper.io[3] to generate CSP code for your site, you will only have a 24-hour evaluation period before it's $50 a month minimum.

If you do choose to use it and you install the extension and add the CSP policy to your headers, you will need to make it all one line and add a ?v=1 to the end of the report-uri (like endpoint.csper.io?v=1;) to track changes in policy. This versions the rule and is important for when you try to update your code with Csper, and for some reason doesn't start by default. Once added, the version increments automatically.


  1. You can find additional CSP source values here: CSP source values - HTTP | MDN ↩︎

  2. I know adding other domains is less secure, but it could have required extra steps for an attacker ↩︎

  3. Which has plugins for Chrome (CSP) Generator and Firefox (CSP) Generator ↩︎