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.