I'm using Cypress and Axe to test my website for accessibility but it appears to be ignoring the content security policy (CSP) I have set using a meta tag.
When I run the test I get the following on cy.checkA11y():
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' 'unsafe-inline'"
However the target web page (andrewhick.com)'s source code contains the following:
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; ">
I tried googling the error, but can't find anyone else with a similar enough issue.
I also considered whether the issue was caching, but reopening Cypress (which I believe should clear the cache) didn't help and besides, Cypress clears the cache automatically.
It could be because the CSP is defined in a meta tag rather than on the server, but I don't believe that my hosting company allows access to the server.
The failing test is stored here.
Also unhelpful is the fact that the issue is intermittent and the suite did work once. I tried adding, removing and re-adding 'unsafe-eval' but the test results didn't correspond to whether the CSP had been updated or not. And although I'm not confident in Javascript, the test doesn't seem to have any obvious syntax errors. Can anyone help?
Related
My asp.net project is working fine at our QA machine and deployed at customer end. But when the browse URL, website is not properly displaying. Some alignment issue at customer side any browser. When I clicked F12,It shows error as "Refused to execute inline script because it violates the following Content Security Policy directive: "default-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-yP/phO6MWRqPDsL5fwP/+7pIbMUdA+zgVlj8/r2BJDo='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'script-src' was not explicitly set, so 'default-src' is used as a fallback."
It seems server side "Content Security Policy" is missing??
Can any one guide me in above issue what need to be done at server side to fix the above issue as it is working fine in our environments like DEV, QA environments.
Thanks in advance
There is a Content Security Policy set on the customer system. This could be a default policy added or an intentional restriction by the customer. You will first need to find where the policy is added and then either remove or modify it or alternatively change your code.
Based on the error messages you'll need to rewrite inline script and inline style into separate files or add "script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'. Note that allowing 'unsafe-inline' is not desired, so your preferred option should be change your code. Noting that violations arise from jquery.min.js it might help to upgrade jquery if the version used is old.
Our website is designed based on WordPress tool and published on Azure web service. Our goal is to use google analytic for checking traffic. Due to this fact, the google analysis tag was added in the header part of our page which causes the following error:
Refused to load the script 'https://www.googletagmanager.com/gtag/js?id=??' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' 'unsafe-inline' *.msecnd.net *.google.com *.gstatic.com". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
I understand that violation of the Content Security Policy is the main problem. Therefore, I added meta in the header (Content-Security-Policy:
script-src 'unsafe-inline') but the issue did not disappear. I will appreciate any help.
Since you have got a Content Security Policy (CSP) violation, you already have a first CSP published at the page.
Adding a second CSP via meta tag (or even via second HTTP header) will not solve a problem, because all sources should pass through both CSPs to be allowed.
Therefore you have to add blocked source (https://www.googletagmanager.com) in first CSP into script-src 'self' 'unsafe-eval' 'unsafe-inline' *.msecnd.net *.google.com *.gstatic.com;.
Check if your WP has some installed plugins to manage CSP, or CSP is published in the .htaccess file.
Since you have 'unsafe-eval' 'unsafe-inline' in the script-src, you should not have problems with Google Tag Manager (GTM).
Anyway you can check CSP for your GTM-XXXXXX ID - which additional scripts are loaded by GTM and which tokens are required in you specific case.
I have a web app which I want to display in an iframe in web apps with different domains. Since I have added a content-security-policy header my app refuses to display in iframe. I saw that i need to add frame-ancestors options but all the examples I see are using specific domains. How can I allow it for all domains? Is "frame ancestors *;" enough? Thanks!
Briefly - yes, * allows any sources for iframe except data:.
Pls note that frame-ancestors is not supported in the meta tag <meta http-equiv='Content-Security-Policy' content="..."> (but looks like you use HTTP header to delivery CSP, so this warn not for you).
But if you really wish to allow all frame ancestors - more reliable not specify frame-ancestors directive at all, because for now Mozilla Firefox has some bugs with it.
PS: You did not attach print screen of errors in browser console - may be iframes was block by other reason than CSP?
updated after exposed CSPs details
<html>
parent page issues CSP: default-src 'self';
since frame-src omitted, it fallback to default-src and result be: frame-src 'self'
<iframe src=''></iframe>
</html>
iframe is allowed with the same scheme://host:port as parent page loads.
'self' is tricky in that if parent loaded via HTTP:, iframe via HTTPS: will blocked in CSP2-browsers. CSP3-browsers do upgrade (see para 3) HTTP: to HTTPS:, so all OK.
If parent page issue frame-ancestors * policy, it means you allow to embed it into iframe to any another webpage.
X-Frame-Options HTTP header provide the same functionality, but it's overridden if frame-ancestor is issueed.
frame-ancestor directive does not affects <iframe> embed into page who published this CSP. It affects where it allowed to embed this page.
But <iframe> could publish its own CSP with rule frame-ancestors domain1.com domain2.com to restrict it embedding to other web-pages.
That's how it works. You could play with test of frame-ancestors to clarify details for different <iframe src=/srcdoc=.
Therefore if you embeds iframe from your own domain/subdomains, it's more safe to use:
frame-ancestors 'self';
or if you use subdomains:
frame-ancestors http://example.com https://example.com http://*.example.com https://*.example.com;
I have a Jira instance running under nginx and we have some CSPs configured in nginx.
Now we are installing an app that generates links that trigger a browser extension, the URLs start with goedit:
The vendor of the app suggests this CSP header:
add_header Content-Security-Policy
default-src https: goedit: wss: 'unsafe-inline' 'unsafe-eval';
img-src https: data: 'unsafe-inline'" always;
I am now trying to incorporate this into our CSP header.
Our CSP Header includes
frame-src '' https://assets.zendesk.com https://www.facebook.com https://$server_name;
When I now click on one of the Links for that app I get this error message in the console:
Refused to frame '' because it violates the following Content Security Policy
directive: "frame-src https://assets.zendesk.com https://www.facebook.com https://my-server.dein-james.de".
I am wondering: What do I need to put into the frame-src to allow this kind of link ('')?
I'd rather not drop the whole frame-src part, I want to keep those whitelisted.
thanks in advance
Jens
I know this is quite an old thread now but I came across a similar issue today. With mine I was using data: in the object-src and I had to ensure data: was then in the frame-src.
Therefore I would check that in frame-src you include any schema's, I suspect it might be the goedit: or wss: in your example?
Though this is old, I found that:
Stefan's solution works.
I had a situation where dynamic iframes (meaning, an iframe added dynamically) were attempting to load a pdf for nice display (in chrome), and though the scp contained "self" for frame-src, and the pdf was from the current domain, some users couldn't see the content, their consoles showed the above error. After messing around, found that simply there is a setting to tweak in the chrome browser - go into the settings, search "pdf" and find the section where you can toggle for pdf the setting that makes pdf's download automatically, vs display in the browser.
I am stuck. I can't get the google analytics (and other external scripts for that matter) running.
Here's what I did in nginx:
server {
# other stuff
location = /mylocation {
add_header Content-Security-Policy "script-src 'self' 'unsafe-inline' 'unsafe-eval' www.google-analytics.com";
}
}
I've attached a screenshot to show that this header information is actually received by the browser (i.e. in this case it's Firefox).
So the script should be executed but it isn't.
In the Console I am getting (translated from German the actual English error message will propably be different):
"Content Security Policy: the settings of the page have blocked loading of a resource on https://www.google-analytics.com/analytics.js ("script-src")"
What's wrong with my policy settings?
So after banging my head against the wall for hours and even telling my customer that I manufactured a broken functionality it turns out the problem was an add-on I had installed on my dev machine's firefox. Finally found the solution here:
Strange CSP error in Firefox