FriendlyCaptcha / friendly-challenge

The widget and docs for the proof of work challenge used in Friendly Captcha. Protect your websites and online services from spam and abuse with Friendly Captcha, a privacy-first anti-bot solution.
https://friendlycaptcha.com
MIT License
411 stars 58 forks source link

CSP Documentation missing style-src 'unsafe-eval'? #269

Open kmindi opened 1 month ago

kmindi commented 1 month ago

Hi,

I have not yet created a MVP or anything similar to further dig down, but apparently the recommended settings https://docs.friendlycaptcha.com/#/csp miss a step about the style-src / style-src-elem.

The widget.module.js injects a style element, which is blocked on a page with the following Content-Security-Policy Error in Chrome:

widget.module.min.js:1 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' 'nonce-rD8UmTfY4BIp0ZHw'". Either the 'unsafe-inline' keyword, a hash ('sha256-DtJ0G5eArSV7tvvFUUeV7iyiWfBGflIkRW64/tmMWUk='), or a nonce ('nonce-...') is required to enable inline execution.

Thanks for confirming or looking into it. I'm happy to provide more information if needed and update this issue.

merlinfuchs commented 1 month ago

Hey, you are right that you have to add unsafe-inline to either style-src or default-src. I will look into why this isn't documented yet!

Alternatively, you can set skipStyleInjection and add your own style sheet (or copy ours) to style the widget. This way you can avoid the CSP issue.

kmindi commented 1 month ago

Thanks already!, Yet, adding it seems to have no effect because we use a nonce, but don't know why it does not work with that nonce, it should be set at all places...