I'm trying to include the speedof.me library in my Chrome App to allow the user to do some bandwidth testing, but it seems that due to some security restrictions it does not allow me to load it. The error I get is:
Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "default-src 'self' chrome-extension-resource:". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.
I couldn't really find any documentation on how to get around this. I tried both including the js file in the html:
<script src="api.js" type="text/javascript"></script>
and also dynamically loading it through javascript:
$.getScript("api.js");
Both of those result in that same error message. Per suggestions in the comments I also tried modifying the content_security_policy:
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
That doesn't work since this is a packaged app and not an extension.
I tried sandboxing as well, but I had a bunch of other chrome app api logic in that page and sandboxing disables that.
Is what I'm trying to do just not feasible for a Chrome app? This is the first one I've ever done and I inherited it from someone else that never quite finished it.
Related
Currently I Try to Integrate Jquery Terminal on my chrome extension with manifest version 3, and I've an issue with Content security policy, every time I run the extension, I get this error.
Refused to load the script 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js' because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
I tried this first Content Security Policy directive issue with MV3 but it had no answers
Can somebody help me to fix this error using Manifest version 3.
I am trying to use a hash with my content security policy...
Below are two example errors in my console:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' apis.google.com cdn.iubenda.com cdnjs.cloudflare.com www.googletagmanager.com". Either the 'unsafe-inline' keyword, a hash ('sha256-oKmCrr+GWRARSXYeVJshOWETr0oqOtt73CNO8efpujQ='), or a nonce ('nonce-...') is required to enable inline execution.
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' apis.google.com cdn.iubenda.com cdnjs.cloudflare.com www.googletagmanager.com". Either the 'unsafe-inline' keyword, a hash ('sha256-pS4Uy3ilo+JLn8IadtJGfyO9z7jqIrGUONfEUDLxoPk='), or a nonce ('nonce-...') is required to enable inline execution.
Here is the corresponding content security policy directive:
add_header Content-Security-Policy "default-src 'self'; script-src 'self' apis.google.com cdn.iubenda.com cdnjs.cloudflare.com www.googletagmanager.com; style-src 'self' fonts.googleapis.com; img-src 'self' cdn.shortpixel.ai secure.gravatar.com; font-src 'self' fonts.googleapis.com fonts.gstatic.com";
Specifically in this example:
script-src 'self' apis.google.com cdn.iubenda.com cdnjs.cloudflare.com www.googletagmanager.com;
From what I gathered from reading the CSP guide on hashes, I should be able to add the hash as per my console to the directive...
The easiest way to generate it is to just open the developer tools console and it will output what the expected hash of your script was in the console error message.
But if I modify my directive to include the hash (example below), I still get the same error in console (obviously with a different hash).
script-src 'self' apis.google.com cdn.iubenda.com cdnjs.cloudflare.com www.googletagmanager.com 'sha256-oKmCrr+GWRARSXYeVJshOWETr0oqOtt73CNO8efpujQ=';
How exactly is the correct way to hash a CSP directive? And why are there multiple errors for the same directive, is this basically one for each domain specified? Should one hash cover all the domains specified?
Not really sure how I should be doing this.
From what I gathered from reading the
content-security-policy.com/hash/ CSP guide on hashes, I should be
able to add the hash as per my console to the directive...
Yeah, it's working only "theoretically", the "practice" is more hard. Yes, Google Chrome calcs hashes, but you need to read the error message carefully to determine what is really blocked: inline script, javascript: navigation or inline event handler. Because each of these have own way how to fix.
- Inline scripts can be just allowed by 'sha256-VALUE' token.
- to allow javascript: navigation and inline event handlers you need to use 'sha256-VALUE' tokens with 'unsafe-hashes'. And not all browsers support 'unsafe-hashes' for javascript: navigation as for now.
But if I modify my directive to include the hash (example below), I
still get the same error in console (obviously with a different hash).
Why do you stopped? I see you use www.googletagmanager.com (GTM), do you think GTM has only one inline script? You allowed the parent script, it began to load the child ones, so you need hashes for both.
You can use parent script hash + 'strict-dynamic' token to allow all the childs ones, but it does not work in Safari as for now.
At the final you will get a lot of hashes for all inline scripts. Bad thing is that GTM and others can time to time change content of it inline scripts, so you have to add a new hashes and to remove obsoletes. But you don't know which hash to which script belongs.
Therefore the preferable way is to use 'nonce-value' for any inline scripts, all the more since GTM distributes 'nonce' to all inline scripts except Custom HTML Tags. For Custom HTML Tags(if used) you can use hashes, because those scripts is under your control.
It's better to investigate all inline scripts manually before decide how it easier and reliable way to allow them.
PS: GTM is a hard nuts for CSP because GTM can be used to inject a open list of inline/external scripts. And if use the custom JavaScript variable names are used for the «Custom HTML tag», it required to allow 'unsafe-eval'.
You can test your GTM ID for what additional scripts it loads and which CSP is enough for it.
I faced this problem when I try to reload my react application web page.
Note: In the development phase there was no issue with this kind of thing, but when I deploy it to production I faced this issue. Thank you.
Refused to load the image 'http://104.248.153.121:8080/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.
Here is an error image log: Error Log Refuse to load image
The Content-Security-Policy meta-tag allows you to reduce the risk of XSS attacks by allowing you to define where resources can be loaded from, preventing browsers from loading data from any other locations. This makes it harder for an attacker to inject malicious code into your site.
Sample that says content="default-src 'self'" means this:
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
How to allow multiple sources?
You can simply list your sources after a directive as a space separated list:
content="default-src 'self' https://example.com/js/"
Note that there are no quotes around parameters other than the special ones, like 'self'. Also, there's no colon (:) after the directive. Just the directive, then a space-separated list of parameters.
I am trying to load some css and scripts via some CDNs to improve loading times but I am getting a content security policy issue, but after a fair amount of time reading up on it and trying out different polices it is still giving my the same error.
Currently my policy looks like this -
<meta http-equiv="Content-Security-Policy" content="default-src 'self' https://code.jquery.com/ https://cdnjs.cloudflare.com/ https://maxcdn.bootstrapcdn.com/">
which from my understanding should mean I can load anything from the site itself and the 3 URLs E.G for maxcdn I should be able to load https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js
I did try the very simple and not to be used policy of
<meta http-equiv="Content-Security-Policy" content="default-src *">
but that didn't change anything.
The error I'm getting is -
Refused to load the script 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.
The script its trying to load (I will do fall backs after i get this working)-
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
I have tested in chrome (55.0.2883.87) and Edge.
From the error message its as if its not taking my policy but using the default policy set by the browser?
Any help would be much appreciated :)
The script loads without a problem when I test it with a CSP provided by the meta tag you included in your question.
I was able to reproduce the problem by including a conflicting CSP using an HTTP header.
A real HTTP header will trump a meta tag.
You need to make the changes to your server side code or HTTP server configuration instead of to the document.
I had a similar problem due to... an ad blocker (uBlock Origin)
My application requires external URL of GoogleMap API to be executed in a packaged App. When I execute the code on simulator, I get the following error in Security Tab
"Content Security Policy: The page's settings blocked the loading of a resource at https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&callback=initialize ("script-src app://58b444ed-2bd9-4ce2-8687-09694b09d6ae")."
Kindly provide a solution to handle this
Regards
Rashmi
There are few reasons why you might get a CPS error. Please refer to this url for more information. https://developer.mozilla.org/en-US/Apps/Build/Building_apps_for_Firefox_OS/CSP
By default, CSP is enforced only on privileged and certified apps. If you have a simple packaged app, you shouldn't have CSP issues. If you didn't mention anything for the app type, you shouldn't have issues.
The CSP for privileges app are:
"default-src *;
script-src 'self';
object-src 'none';
style-src 'self' 'unsafe-inline'"
And for certified:
"default-src *;
script-src 'self';
object-src 'none';
style-src 'self'"
Which mean that you cannot have a script that points on a remote server other than your own. If your packaged app is loading an external url, you could probably proxy the google js trough your server. As the script-src will match the default-src, it should work.
Otherwise, you could probably save the script directly in your project. This is probably not recommended but that could also work.
There is also chances that the script provided by google won't work anyway if they use eval and new Function.