Error: Uncaught EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".
The error only shows in other browser and not chrome. I found some answers and they say to add
<meta http-equiv="Content-Security-Policy" content="font-src 'self' 'unsafe-inline' data:; img-src 'self' data:; style-src 'self' 'unsafe-inline' data:; script-src 'unsafe-eval' 'unsafe-inline' data:; default-src 'self' localhost:*">Reference: Content Security Policy
And after adding the meta tag an error pops up on refresh of the browser including chrome.
Error: Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'unsafe-eval' 'unsafe-inline' data:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
Please help.
I found the answer. The problem was with helmet node module. When I remove the app.use(helmet()) from my backend, The problem goes away.
If you're also having this error, I replaced the app.use(helmet()) with app.use( helmet({ contentSecurityPolicy: false, }) );