I want to enforce CSP as a security measure in my web application.
From the server end , I have set the policy to "allow" self for all of its resources.
However there is one particular front end node_module file , which is throwing error as attached below.
The CSP header set is :
script-src 'self' 'node_modules/aurelia-webpack-plugin/runtime/empty-entry.js'; script-src-elem 'self'; style-src 'self'; img-src 'self'
Please help , I have been trying to find a solution for more than a week now!
Solutions tried:
Try the front end to make it ignore this file since it is an empty file. But I am not able to get it to ignore.
Trying from server end to bypass this particular file by changing the rules
TIA.
Update:
Error message
UnCaught EvalError: Refused to evaluate a string as Javascript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'"
at ./node_modules/aurelia-webpack-plugin/runtime/empty-entry.js
The file seems to be allowed to load as it is loaded from the same source and you have allowed script-src 'self'.
The problem seems to be that the code in the file does eval(), new Function(), setInterval() or setTimeout(), which requires 'unsafe-eval' to be allowed. This is strange given that the file should be empty. Your console errer may provide you with a direct link to the offending code.
You could add 'unsafe-eval' to script-src. This would make your CSP less strict, but it is of course a lot better to set "script-src 'self' 'unsafe-eval';" than to not restrict scripts with a CSP at all.
Related
I'm currently using Netlify to host my website and I'm currently working on the header file for the Content Security Policies in the header file.
Here's the conundrum I'm facing:
Where the policies are written in one line, it breaks the website but passes GitHub checks. Example:
default-src 'self' cdn.example.com; script-src 'self' js.example.com; style-src 'self' css.example.com;
Where the policies are on multiple lines, it seems to work, but fails GitHub checks. Example:
default-src 'self' cdn.example.com;
script-src 'self' js.example.com;
style-src 'self' css.example.com;
Does anyone have any insight regarding this?
The react documentation points to this file as an example of using babel inline https://raw.githubusercontent.com/reactjs/reactjs.org/master/static/html/single-file-example.html
Even though it's not recommended for production, it would be helpful for me to develop faster if I could just write jsx for the time being in my chrome extension without having to compile myself. My issue is that if you try this you get an error in a chrome extension.
babel.min.js:1 Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' https://unpkg.com". Either the 'unsafe-inline' keyword, a hash ('sha256-FN6NaNuBVCZD7+6eEydixs7VVD0vxTZKnwjth9yDpCC='), or a nonce ('nonce-...') is required to enable inline execution.
I've tried adding a content security policy to my chrome extension, but still get the same error: Here is my policy in my chrome extension manifest
"content_security_policy": "script-src 'self' 'unsafe-eval' https://unpkg.com; object-src 'self' 'sha256-FN6NaNuBVCZD7+6eEydixs7VVD0vxTZKnwjth9yDpCC='"
Anyone have any ideas on what I'm doing wrong?
Yes, another question about the CSP not loading a base64 image BUT I have researched a lot and can't find the solution. I have tried every configuration I've founded and still doesn't works.
So, what I'm trying is to load an Base64 image via Javascript.
var dataString = jQuery('#signature').jSignature('getData');
JQuery('#sig').append("<img class='imported' src='" + dataString + "'></img>");
As you can see it's not a big deal appending the base64 image (in localhost it works).
Then, searching about the CSP I found that the correct configuration to avoid the CSP with the Base64 Images is (and this is how I have the configuration):
add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src 'self' data:; font-src 'self' data:";
I have no problem with the font base64 but with the images it always throws this error:
Refused to load the image 'data:image/png;base64,...' because it violates the following Content Security Policy directive: "default-src *". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.
Any ideas will be really appreciated, I really have no idea what is happening.
Have you tried as #Phonolog said. I have tried creating a plugin to support image url in importData rather than data-url-formatted.
Please check this post and see if it helps.
Create a jSignature plugin which sets the img src to the signature url.
inject the plugin
on importData remember to pass the plugin identifier
This way you can remove the data: from the csp header and self should be enough (img-src 'self')
The Zemanta Chrome Extension fails to load with the following error message
loader.js:13 Refused to load the script 'https://static.zemanta.com/widgets/blogger.com/merged-blogger.js?v=1451290656'
because it violates the following Content Security Policy directive:
"script-src 'self' *.google.com *.google-analytics.com 'unsafe-inline'
'unsafe-eval' *.gstatic.com *.googlesyndication.com *.blogger.com
*.googleapis.com uds.googleusercontent.com https://s.ytimg.com
www-onepick-opensocial.googleusercontent.com www-bloggervideo-opensocial.googleusercontent.com
www-blogger-opensocial.googleusercontent.com *.blogspot.com https://www.blogblog.com".
I have changed the content_securiy_policy line to the following, and reload the extension
"content_security_policy": "script-src 'self' https://ssl.google-analytics.com https://*.zemanta.com; object-src 'self'"
Why is it that "https://*.zemanta.com" is not listed in the CSP directive in the error message above, and how can I make sure it is in the CSP?
It looks like an error thrown by a webpage with its own CSP, not inside your extension. So the CSP you set there has no effect.
It probably happens as a result of a content script trying to insert <script src="..."> into the page. That's subject to the page's CSP and can fail.
You can try to bypass the page's CSP by loading the script with XHR and inserting a <script> tag with the code included instead of src link. Note that this may fail at a later stage, since while the script will be executed this way, it will be subject to CSP in its own actions (so if it, say, tries to add a <script> tag as well, it will fail).
Alternatively, you could use webRequest API to intercept and modify the CSP header. That's risky since you're loosening the page's security in general.
I'm trying to use Firebase in a Chrome extension background page, but it looks like it's executing inline-scripts, which isn't allowed because of security concerns.
I've currently set the CSP to:
{"content_security_policy":
"script-src 'self' https://cdn.firebase.com https://<my-subdomain>.firebaseio.com; object-src 'self'"}
I'm able to load the initial Firebase script, but upon calling new Firebase('my-firebase-url'), I get the following error:
Refused to execute inline script because it violates the following
Content Security Policy directive: ". Uncaught
ReferenceError: pRTLPCB is not defined
Is there any work around or advice the Firebase team (or anyone) can give, and maybe an explanation of why scripts are being executed inline?
At the time the question was asked, there was a bug preventing Firebase from working in Chrome extensions, but this has now been fixed.
The correct CSP is:
"content_security_policy": "script-src 'self' https://cdn.firebase.com https://*.firebaseio.com; object-src 'self'"
(Note that the wildcard in the domain is important, since Firebase may connect to other subdomains internally.)
For a sample chrome extension using Firebase, see: https://github.com/firebase/firebase-chrome-extension.
I'm having a similar problem; you see, Firebase's constructor seems to perform some dom manipulation in order to do some scripting (vague, I know), which triggers Chrome CSP because well, you are not supposed to do that.
I even trying to wrap the constructor through the Sandbox Pages, but without success (I get an DOM ERR 18, even though my manifest has all permissions). Same happens if you try to do it in a Background Page or a Popup Page for a Page Action/Browser Action.
Alternative? You can inject Firebase as a content script (do it from your manifest), and through Message Passing send the callbacks as Chrome.extension.sendMessage. I'm exactly doing this at the moment, so I can tell you how that goes, so far, at least the Firebase constructor works.
Solution? James Tampling reads this and prompts the Firebase team to look up after this :)
UPDATE: Injecting Firebase.js as a Content Script doesn't work neither, but the good news is that the Firebase team (reach Andrew Lee) is checking it out.
UPDATE 2 Firebase team fixed it, and now it does work from a Popup page (both in a Browser Popup or a Page Action one). You need to add the following CSP in your manifest.json though "content_security_policy": "script-src 'self' 'unsafe-eval' https://cdn.firebase.com https://*.firebaseio.com https://*.firebaseio.com; object-src 'self'; " It works wonders after that.
I have a cordova js app, only the below one worked:
<meta http-equiv="Content-Security-Policy" content="
default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval';
script-src 'self' https://www.gstatic.com https://cdn.firebase.com https://*.firebaseio.com; object-src 'self';
" />
hope this helps.