You should either
- host the external sources on your own (so that they are loaded from static.mindsphere.io" or
- you should add the urls to the csp header in developer cockpit. For changing the csp header you have to unregister/change and register again.
Is this the right way to add urls explicitly:
Before adding my scripts and css :
default-src 'self' static.eu1.mindsphere.io; style-src * 'unsafe-inline'; script-src 'self' 'unsafe-inline' static.eu1.mindsphere.io; img-src * data:;
After adding my scripts and css :
default-src 'self' static.eu1.mindsphere.io; script-src-elem 'https://code.jquery.com/jquery-3.3.1.slim.min.js https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js'; style-src * 'unsafe-inline'; img-src * data:;
I found the correct way of adding external urls:
We only need to add the domain names and not the entire url.(Make Note)
Step 1: First add in default-src. Add space after static.eu1.mindsphere.io and start adding domain names which are giving error.
Step2 : Then add in srcipt-src. Add space after static.eu1.mindsphere.io and start adding domain names which are giving error.
default-src 'self' static.eu1.mindsphere.io code.jquery.com maxcdn.bootstrapcdn.com cdnjs.cloudflare.com stackpath.bootstrapcdn.com; style-src * 'unsafe-inline'; script-src 'self' 'unsafe-inline' static.eu1.mindsphere.io code.jquery.com maxcdn.bootstrapcdn.com cdnjs.cloudflare.com stackpath.bootstrapcdn.com; img-src * data:;
@ashmore great that I could help and you could modify you csp snippet correctly!
For other interested readers:
Here is also more general information:
General hint: If your application is not loading correctly while development, have a look in the browsers console and check for 'csp'-errors like in the initial post.
Yeah!! Thanks for pointing about 2 versions of bootstrap. I will definitely reduce to the latest one.
And also will try to download files and host instead of depending on url.
Thanks @gabe for your help!!!
I am struggling with the same issue. I followed every step as mentioned in this mail trail. Was able to resolve most of the issue. But I am also using can js graphs and google charts I have added there base url in csp but they are still not working . Kindly help.
See the issue :
Refused to load the script 'http://canvasjs.com/assets/script/canvasjs.min.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' static.eu1.mindsphere.io maps.googleapis.com gstatic.com use.fontawesome.com cdnjs.cloudflare.com fonts.gstatic.com canvasjs.com". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
I guess you should load it via https in your source code:
The csp looks ok for me.
I tried on https this does not work even locally. I tried even with Google charts there the reference is in https but still running into same issue.