, 1 min read

On the Brittleness of Content Security Policy

I explored the possibility of employing Content Security Policy for this very blog. I succeeded in enforcing a couple of URL whitelists. But that showed that whenever the referring websites change anything on their end, I am cooked.

Below is an NGINX configuration to allow for JavaScript libraries like

  1. MathJax
  2. DataTables
  3. TikTok
  4. WordPress
  5. CodePen
  6. Ahrefs Analystics
  7. X/Twitter
add_header Content-Security-Policy "
    script-src 'self' 'unsafe-inline'
        https://cdn.datatables.net
        https://cdn.jsdelivr.net
        https://code.jquery.com
        https://platform.twitter.com
        https://s0.wp.com
        https://www.tiktok.com
        https://*.ttwstatic.com
        https://*.codepen.io
        https://public.codepenassets.com
        https://analytics.ahrefs.com;
    worker-src 'self' blob:;
" always;

Because I have inline JavaScript I need unsafe-inline.

For CodePen we explicitly need to whitelist public.codepenassets.com.

For TikTok we have to whitelist *.ttwstatic.com and worker-src 'self' blob:.

Obviously, if anything of those things change slightly, my blog is no longer fully functional.