Refused to Load the Script Because It Violates the Following Content Security Policy Directive

Refused to load the script because it violates the following Content Security Policy directive

It was solved with:

script-src 'self' http://xxxx 'unsafe-inline' 'unsafe-eval';

CSP, Refused to load the script, violates the following Content Security Policy directive: script-src 'self'

It looks like you already have a published CSP via an HTTP header because a console error saying:

it violates the following Content Security Policy directive "default-src 'self'"

while your meta tag contains other default-src sources: default-src 'self' https:*//api.mapbox.com/mapbox-gl-js/v2.3.1/mapbox-gl.js

You can check the CSP response HTTP header that you have, the tutorial is here.

In this case by adding meta tag you'll have 2 CSPs which will work independently each other, therefore CSP in HTTP header will continue to block your scripts.

Node.js has a Helmet middleware in dependancies, Helmet 4 automatically publishes a default CSP via HTTP header. Check it.

In this case you have 2 opts:

• disable Helmet's CSP: app.use( helmet({ contentSecurityPolicy: false, }) ); and use a meta tag.
• configure CSP header via Helmet (preferred way).

BTW you have errors in the:

default-src 'self' data:gap 'unsafe-eval' ws: ; style-src 'self' 'unsafe-inline' script-src *; media-src *; font-src *;  connect-src *; img-src 'self' data: content:;

1. data:gap is a wrong source, use data: or data: gap: depending on what you need.
2. missed ; before script-src

Chrome Extension: Refused to load the script, because it violates the following Content Security Policy directive: script-src 'self'

Your code try to add external script t to the extension page.
It is conceptually prohibited in manifest V3 for security reason.
Actually, CSP directive script-src 'self' prohibits that.

https://developer.chrome.com/docs/extensions/mv3/intro/mv3-migration/#content-security-policy

You cannot execute external code also in content script.

https://developer.chrome.com/docs/extensions/mv3/intro/mv3-migration/#executing-arbitrary-strings

If you want to execute external code, you can execute it in sandbox page.

https://developer.chrome.com/docs/extensions/mv3/manifest/sandbox/

---

Related Topics