Netlify CSP errors

[leehbi]

I'm using your example netlify config file but I'm getting lots of csp errors. The syntax highlighting is working locally but not remotely.

See leehbi.com

Content-Security-Policy: The page’s settings blocked an inline style (style-src-attr) from being applied because it violates the following directive: “style-src 'self' https://talk.hyvor.com https://cdn.cloudflare.com https://cdn.jsdelivr.net https://fonts.googleapis.com”. Consider using a hash ('sha256-Pau/mFwKMbg/2fhJaT3LxfYK74s4Bcagq+jjihRVXCc=', requires 'unsafe-hashes' for style attributes) or a nonce.

Zola 0.22.1

Repo : https://github.com/leehbi/BlogZola

Any ideas?

[leehbi]

I added this to netlify config and CSP have gone and the syntax highlighting is working.

Content-Security-Policy = "style-src 'self' 'unsafe-inline';"

Would be better if we can enable CSP errors with no error.

[Jieiku]

I remember NOT needing unsafe-inline for my style, but that was 2-3 years ago, I now have responsibilities that prevent me from investigating anything, my own site has sat dormant for a little over a year now.

I know that zola recently went with a new style engine and ive not had more than 2 minutes to even look at it, but I did quickly review and merge a pull request recently related to syntax highlighting in zola. (for this theme)

[leehbi]

I'll have deeper look in a few weeks.

Interesting that inline styles are problematical - I must be getting old.

[leehbi]

It's due to the new code highlight putting colors inline.

I amend the CSP :

Content-Security-Policy = "default-src 'none'; frame-ancestors 'none'; object-src 'none'; base-uri 'self'; manifest-src 'self'; worker-src 'self'; form-action 'self'; connect-src 'self' .hyvor.com ws://.hyvor.com; script-src 'self' talk.hyvor.com; img-src 'self' data: talk.hyvor.com cdn.cloudflare.com; frame-src 'self' www.youtube-nocookie.com player.vimeo.com streamable.com www.streamable.com; media-src 'self' data: cdn.cloudflare.com www.youtube-nocookie.com player.vimeo.com; font-src 'self' cdn.cloudflare.com cdn.jsdelivr.net fonts.gstatic.com; style-src 'self' 'unsafe-inline' talk.hyvor.com cdn.cloudflare.com cdn.jsdelivr.net fonts.googleapis.com;"

[Jieiku]

Thanks for investigating that, I definitely dont like inline colors if it can be avoided, so I will look into how zola is now handling the syntax highlighting with their new changes, there may still be a class option, fingers crossed.

If that is the only way zola now handles syntax highlighting then I guess our hands are tied and your edit to the CSP is the way to go for now.