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)
Related
Im getting this error and I don´t know why, the scripts that I have included works?
And the error only shows up when I load a subpage. Not when I load the startpage.
So what Im I doing wrong?
The source list for Content Security Policy directive 'script-src' contains an invalid source: ''strict-dynamic''. It will be ignored.
<meta http-equiv="Content-Security-Policy" content="script-src * 'unsafe-inline' 'unsafe-eval' https://checkout.dibspayment.eu https://www.google-analytics.com https://maps.google.com;">
Any input really appreciated, thanks.
And the error only shows up when I load a subpage. Im getting this error and I don´t know why
The source list for Content Security Policy directive 'script-src' contains an invalid source: ''strict-dynamic''. It will be ignored.
It's not an error, just a warning that you browser does not support the 'strict-dynamic' token. (guess you use Safari).
I guess that subpage is a some Google's iframe (oAuth2, reCaptcha, etc). That iframe publush it's own CSP wich contains the 'strict-dynamic' token and this CSP was created in browsers backward compatibility mode (Google make such).
That's a warning from third-party CSP, not your's.
the scripts that I have included works?
Your parent page has own CSP which allows scripts. The CSP of nested browsing context (iframe) does not affects parent page (except the frame-ancestors directive).
So what Im I doing wrong?
Nothing. It's an intended regular work of Content Security Policy.
Each browsing context can have its own CSP. But all warns will flow to one browser console, and that is mislead.
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 need to relax the CSP (Content Security Policy) in Chrome to enable a redirect with some get parameters to the Azure login page. When processing such redirects Chrome applies policy restrictions related to form submissions. The default policy in such cases amounts to
<meta http-equiv="Content-Security-Policy" content="form-action 'self' javascript:"/>
In this case the redirect to https://login.microsoftonline.com/...
wont' work. The MDN says that you can expand the list of allowed destinations, which I tried like so:
<meta http-equiv="Content-Security-Policy" content="form-action 'self' https://*.microsoftonline.com javascript:"/>
It appears to have no effect at all as still get the same error on the console:
Refused to send form data to 'https://login.microsoftonline.com' because it violates the following Content Security Policy directive: "form-action 'self' javascript:"
Note also that playing with the order of the attributes or removing the javascript: part does help. However, removing the self part is evidently paid some attention to by Chrome as in this case I'm not able to send data back to the origin. It is almost like they let you tighten up the policy but not relax it.
Any help will be greatly appreciated.
I think that it is caused because form-action (according to the documentation):
The HTTP Content-Security-Policy (CSP) form-action directive restricts the URLs which can be used as the target of a form submissions from a given context.
Maybe you could try the default-src directive:
default-src
The HTTP Content-Security-Policy (CSP) default-src directive serves as a fallback for the other CSP fetch directives.
Hope it helps!
Do not include the protocol (https) and i think it will work
I have a strange problem with one server (Hosting company is etisalat in UAE). The website is not loading external scripts (also google fonts) or background images and some javascript.
The error I get in console is like:
"Content Security Policy: The page’s settings blocked the loading of a resource at https://fonts.googleapis.com/css?family=Noto+Sans:400,700,400italic (“default-src http://riviera.ae http://googleapis.com”)"
I've tried adding the following to section:
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'">
But still it does not load it. The images and other works well in internet explorer (But XHR gives error. I haven't tested it completely).
Also tried the following in .htaccess
Header set Content-Security-Policy "default-src 'self' googleapis.com; script-src 'self' www.googleapis.com;"
Hope it's not against stackoverflow policies to share the link of the domain (riviera.ae). Thanks for checking it out.
NB: I tried putting the same application in another server (*nix based systems with apache 2+) and it works fine.
Even a phpinfo() gives the output in plain text (No PHP logo is shown nor the table styles are rendered).
I got it working by putting "Header unset Content-Security-Policy" in the .htaccess file. Have to add other derivatives to make it secure though.
I defined content security policies for one of the application which uses JavaScript files from https://www.youtube.com/iframe_api as follows;
<meta http-equiv="Content-Security-Policy"
content="script-src 'self' https://www.youtube.com;
child-src https://www.youtube.com;">
Now on chrome dev tools, I get the error below:
Refused to load the script 'https://s.ytimg.com/yts/jsbin/www-widgetapi-vflaaT2_k/www-widgetapi.js' because it violates the following Content Security Policy directive: "script-src 'self' https://www.youtube.com".
Should I add https://s.ytimg.com to the content security policy settings?
If yes, does it constitute a security risk as one cannot guarantee whether it may change over time?
How can I effectively define content security policies for YouTube?
Yes that's exactly what you need to do. Ytimg is YouTube's CDN for static files.