Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive

questions
1

Hello. I’m trying to use Alpine.js on Hanami, but I’m getting this error:

Refused to evaluate a string as JavaScript because ‘unsafe-eval’ is not an allowed source of script in the following Content Security Policy directive

I’ve tried looking for solutions, but they seem to be old and say to disable security policies. What would be the safest solution to use Alpine.js (and probably Vue and other solutions that use eval)?

2

hi @devaniljr :wave:

I’ve run into this as well. Alpine provides a CSP compliant build, though the API has changed slightly: CSP — Alpine.js

To potentially make this easier for you / anyone in the future, I’ve created a starter app with everything all setup: GitHub - kyleplump/hanami-alpinejs-starter: Starter template for a Hanami + Alpinejs application

I actually plan on writing a blog post documenting how to setup a Vue + Hanami app in the next few weeks! I’ll follow up with a link to that when its done. hope this helps! :slight_smile:

1 Like
3

@devaniljr you can also configure your Hanami app’s content security policy (CSP) directly, if that is your preference.

See this section from our guides for a high-level overview of how to configure the CSP.

For more detailed API usage, the source code for the CSP config is short and well-documented.