I'm writing a chrome extension that makes use of an <object> in the content script that loads content from my central server to display to the user. On some websites, my attempt at setting the data attribute on the <object> is blocked, with the following error:
Refused to load plugin data from 'https://redacted.com/?url=https%3A%2F%2Fwww.mozilla.org%2Fen-US%2Ffirefox%2F' because it violates the following Content Security Policy directive: "default-src 'self' *.mozilla.net *.mozilla.org *.mozilla.com". Note that 'object-src' was not explicitly set, so 'default-src' is used as a fallback.
My extension works without issue on stackoverflow.com! Note, sometimes it's object-src 'self' blob: instead.
From the response headers of the website my extension is trying to load on, it's clear that that's what is stopping my extension from being able to do what it does (these headers are missing from stackoverflow.com which is why it works):
content-security-policy: default-src 'self' *.mozilla.net *.mozilla.org *.mozilla.com; child-src www.googletagmanager.com www.google-analytics.com www.youtube-nocookie.com trackertest.org www.surveygizmo.com accounts.firefox.com accounts.firefox.com.cn www.youtube.com; script-src 'self' *.mozilla.net *.mozilla.org *.mozilla.com 'unsafe-inline' 'unsafe-eval' www.googletagmanager.com www.google-analytics.com tagmanager.google.com www.youtube.com s.ytimg.com; style-src 'self' *.mozilla.net *.mozilla.org *.mozilla.com 'unsafe-inline'; img-src 'self' *.mozilla.net *.mozilla.org *.mozilla.com data: mozilla.org www.googletagmanager.com www.google-analytics.com adservice.google.com adservice.google.de adservice.google.dk creativecommons.org ad.doubleclick.net; frame-src www.googletagmanager.com www.google-analytics.com www.youtube-nocookie.com trackertest.org www.surveygizmo.com accounts.firefox.com accounts.firefox.com.cn www.youtube.com; connect-src 'self' *.mozilla.net *.mozilla.org *.mozilla.com www.googletagmanager.com www.google-analytics.com https://accounts.firefox.com/ https://accounts.firefox.com.cn/
Is there a way around this? Would Shadow DOM be an option? I've already attempted to add content_security_policy to my manifest.json but this will never work because the browser is respecting what the parent website responded with in it's headers.
Thanks in advance.
Related
Recently we integrated a third party script Pendo.js for application inspection of end user usability.
To allow this script we have added relevant Content-Security-Policy changes to the Nginx server config file.
The Pendo.js script was injected properly and is performing as expected.
But during the excel file download through an API call we are facing the following error.
CSP Header:
add_header Content-Security-Policy " default-src 'self' https:; script-src-elem 'self' 'unsafe-inline' https://.pendo.io; script-src 'self' https://.pendo.io pendo-io-static.storage.googleapis.com pendo-static-5725335814144000.storage.googleapis.com https://.pendo.io 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://netdna.bootstrapcdn.com .marketmedium.net 'unsafe-inline' https://.pendo.io pendo-static-5725335814144000.storage.googleapis.com; font-src 'self' 'unsafe-eval' https://fonts.gstatic.com https://netdna.bootstrapcdn.com; img-src 'self' data: .marketmedium.net https://.pendo.io pendo-static-5725335814144000.storage.googleapis.com https://.pendo.io 'unsafe-inline' 'unsafe-eval'; object-src 'none'; connect-src .marketmedium.net https://.pendo.io pendo-static-5725335814144000.storage.googleapis.com;frame-ancestors https://.pendo.io; frame-src https://.pendo.io 'unsafe-inline' 'unsafe-eval'; child-src https://*.pendo.io;";
Error:
Refused to frame 'dashboardReportDownload?columnNames%5B0%5D=&columnNames%5B1%5D=copy_deal&columnNames%5B2%5D=deal_name&columnNames%5B3%5D=deal_number&columnNames%5B4%5D=deal_status&columnNames%5B5%5D=organization_name&columnNames%5B6%5D=deal_type_name&columnNames%5B7%5D=edh%23id&columnTexts%5B0%5D=&columnTexts%5B1%5D=Copy&columnTexts%5B2%5D=Deal%20Name&columnTexts%5B3%5D=Deal%20Number&columnTexts%5B4%5D=Status&columnTexts%5B5%5D=Organization&columnTexts%5B6%5D=Deal%20Type&columnTexts%5B7%5D=edh%23id&inClauseFields%5B0%5D=edh%23id&edh%23id%5B0%5D=1091&reportId=61f7d68ea90238841a92a0d0&reportViewName=Deal%20Sheet%20Report&downloadFileType=xlsx' because it violates the following Content Security Policy directive: "frame-src https://.pendo.io".
VM3432:6750 crbug/1173575, non-JS module files deprecated.
Your say your frame-src directive is set to "https://*.pendo.io 'unsafe-inline' 'unsafe-eval'" (saying 'seems' as the * character is removed and causing parts of your question to be in italics). Although the error message says that frame-src is just "https://*.pendo.io". When downloading a frame from an undisclosed source is created.
If you addded frame-src to your policy to support pendo, you are no longer using the fallback to default-src which allows "'self' https:". You have thus moved from accepting all sources for frames to only allowing *.pendo.io. You will need to add the blocked host (potentially 'self') to frame-src.
Error: 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'".
The error only shows in other browser and not chrome. I found some answers and they say to add
<meta http-equiv="Content-Security-Policy" content="font-src 'self' 'unsafe-inline' data:; img-src 'self' data:; style-src 'self' 'unsafe-inline' data:; script-src 'unsafe-eval' 'unsafe-inline' data:; default-src 'self' localhost:*">
Reference: Content Security Policy
And after adding the meta tag an error pops up on refresh of the browser including chrome.
Error: Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'unsafe-eval' 'unsafe-inline' data:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
Please help.
I found the answer.
The problem was with helmet node module.
When I remove the app.use(helmet()) from my backend, The problem goes away.
If you're also having this error, I replaced the app.use(helmet()) with app.use(
helmet({
contentSecurityPolicy: false,
})
);
Even By using meta tags, It is still showing error and Iframe is not working
<meta http-equiv="Content-Security-Policy" content="
default-src *;
style-src 'self' 'unsafe-inline';
script-src * 'self' https://checkout.stripe.com 'unsafe-inline'
connect-src : * 'self' https://checkout.stripe.com 'unsafe-inline'
frame-src : * 'self' https://checkout.stripe.com 'unsafe-inline'
'unsafe-eval'
;" >
Link reference : https://stripe.com/docs/security/guide#content-security-policy
Error : Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)
Also I used header() to set this up, but that also didn't worked. Any Help will be appreciated
Your CSP has a lot of errors:
You have missed semicolons ; to separate script-src / connect-src / frame-src directives lists.
: is nor required in the connect-src : * ... and in the frame-src : * ...
Remove 'unsafe-inline' and 'unsafe-eval' from the connect-src and frame-src directives, those are not supported there
The * (asterisk) covers any host-sources like https://checkout.stripe.com and wss://checkout.stripe.com
BUT these are not significant, these just leads the CSP you have really is:
default-src *;
style-src 'self' 'unsafe-inline';
script-src * 'self' 'unsafe-inline' 'unsafe-eval'
This CSP restrict nothing except data:-Urls usage. Therefore the error:
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)
cannot belong your CSP.
Looks like you already have CSP header published somewhere. Hence second CSP via <meta> or HTTP header does not have effect as expected.
Check what CSP header you really have got in browser, the tutorial is here.
Check web-server config in Nginx for add_header Content-Security-Policy ... or .htaccess file (if Apache) for Header set Content-Security-Policy ... presence.
Or maybe you have installed some plugins for managing CSP headers.
You're missing img-src https://*.stripe.com described in the Stripe documentation.
Also the asterisk character alone doesn't work as "any resource" (example of incorrect use in your code: default-src *). You need to use it as part of the <host-source> (e.g. *.example.com). See MDN docs for more details.
Please I need assistance here.
I have a form to submit to another url but when I try to submit it, it refuses to submit and I was checking my console.
On Chrome, I see the following errors
resources2.aspx?HCCID=75694719&culture=en-US&mlcv=3006&template=5:7 Refused to load the image 'https://s4.mylivechat.com/livechat2/images/sprite.png' because it violates the following Content Security Policy directive: "img-src 'self' data:".
Refused to send form data to 'https://cipg.stanbicibtcbank.com/MerchantServices/MakePayment.aspx' because it violates the following Content Security Policy directive: "form-action 'self'".
and on Mozilla Firefox I see the following:
Content Security Policy: The page’s settings blocked the loading of a resource at https://s4.mylivechat.com/livechat2/images/sprite.png (“img-src http://smehelp.themarketplace.ng data:”)
Content Security Policy: The page’s settings blocked the loading of a resource at http://smehelp.themarketplace.ng/purchase/summary (“form-action 'self'”).
Checking around the web for solution, I have added the following to my page header
<meta http-equiv="Content-Security-Policy" content="form-action 'self'">
but the problem still persists.
This results in the fact that I am not able to submit my forms. Earlier, the forms used to get submitted, but I just tried it today and observed this error.
I am running on Google Chrome Version 55.0.2883.95 (64-bit) on a MAC OS.
I will appreciate any suggestion to solve this issue as soon as possible.
Thank you
If you look here because you want to send a form to the same URL (which should be possible with form-action 'self') or another URL listed in your form-action rule, but redirect afterwards, the following could be the cause https://github.com/w3c/webappsec-csp/issues/8 (including a long discussion). One reason is: https://cheatsheetseries.owasp.org/cheatsheets/Unvalidated_Redirects_and_Forwards_Cheat_Sheet.html
The reason why the target url of the redirect is not visible in the CSP report (which is really confusing) is a security issue, see https://w3c.github.io/webappsec-csp/#create-violation-for-request, it would otherwise be possible to analyse the behaviour of form endpoints.
tl:dr;
Chrome and Safari do not allow redirects after submitting a form unless the destination URL is listed in the form-action CSP rule, even if it is a GET redirect that does not contain the original form data.
You are passing the Content-Security-Policy value in your response header:
base-uri 'none'; default-src 'self' https://s4.mylivechat.com;
child-src 'none'; connect-src 'self'; font-src 'self'
https://fonts.googleapis.com https://maxcdn.bootstrapcdn.com
https://fonts.gstatic.com; form-action 'self'; frame-ancestors 'none';
img-src 'self' data:; media-src 'self'; object-src 'none'; script-src
'self' https://www.youtube.com https://maps.google.com
https://www.google-analytics.com https://mylivechat.com
https://s4.mylivechat.com https://maps.googleapis.com 'unsafe-inline'
'unsafe-eval'; style-src 'self' https://fonts.googleapis.com
https://s4.mylivechat.com https://maxcdn.bootstrapcdn.com
'unsafe-inline'
The content security policy that you've added to the page meta will be ignored as this is present in the response header.
You will need to make the following additions (in bold) to your CSP that you are sending in your response header.
base-uri 'none'; default-src 'self' https://s4.mylivechat.com;
child-src 'none'; connect-src 'self'; font-src 'self'
https://fonts.googleapis.com https://maxcdn.bootstrapcdn.com
https://fonts.gstatic.com; form-action 'self'
https://cipg.stanbicibtcbank.com/MerchantServices/MakePayment.aspx; frame-ancestors 'none'; img-src 'self' data:
https://s4.mylivechat.com; media-src 'self'; object-src 'none'; script-src 'self' https://www.youtube.com https://maps.google.com
https://www.google-analytics.com https://mylivechat.com
https://s4.mylivechat.com https://maps.googleapis.com 'unsafe-inline'
'unsafe-eval'; style-src 'self' https://fonts.googleapis.com
https://s4.mylivechat.com https://maxcdn.bootstrapcdn.com
'unsafe-inline';
Add https://s4.mylivechat.com to img-src
Add https://cipg.stanbicibtcbank.com/MerchantServices/MakePayment.aspx to form-action
Remove <meta http-equiv="Content-Security-Policy" content="form-action 'self'"> from your HTML code
I am using CAPTCHA on page load, but it is blocking because of some security reason.
I am facing this problem:
Content Security Policy: The page's settings blocked the loading
of a resource at
http://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit
("script-src http://test.com:8080 'unsafe-inline' 'unsafe-eval'").
I have used the following JavaScript and meta tag:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
<script src="http://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit" async defer></script>
You have said you can only load scripts from your own site (self). You have then tried to load a script from another site (www.google.com) and, because you've restricted this, you can't. That's the whole point of Content Security Policy (CSP).
You can change your first line to:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval' http://www.google.com">
Or, alternatively, it may be worth removing that line completely until you find out more about CSP. Your current CSP is pretty lax anyway (allowing unsafe-inline, unsafe-eval and a default-src of *), so it is probably not adding too much value, to be honest.
With my ASP.NET Core Angular project running in Visual Studio 2019, sometimes I get this error message in the Firefox console:
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”).
In Chrome, the error message is instead:
Failed to load resource: the server responded with a status of 404 ()
In my case it had nothing to do with my Content Security Policy, but instead was simply the result of a TypeScript error on my part.
Check your IDE output window for a TypeScript error, like:
> ERROR in src/app/shared/models/person.model.ts(8,20): error TS2304: Cannot find name 'bool'.
>
> i ｢wdm｣: Failed to compile.
Note: Since this question is the first result on Google for this error message.
I had a similar error type. First, I tried to add the meta tags in the code, but it didn't work.
I found out that on the nginx web server you may have a security setting that may block external code to run:
# Security directives
server_tokens off;
add_header X-Frame-Options SAMEORIGIN;
add_header X-Content-Type-Options nosniff;
add_header X-XSS-Protection "1; mode=block";
add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://ajax.googleapis.com https://ssl.google-analytics.com https://assets.zendesk.com https://connect.facebook.net; img-src 'self' https://ssl.google-analytics.com https://s-static.ak.facebook.com https://assets.zendesk.com; style-src 'self' 'unsafe-inline' https://assets.zendesk.com; font-src 'self' https://fonts.gstatic.com https://themes.googleusercontent.com; frame-src https://player.vimeo.com https://assets.zendesk.com https://www.facebook.com https://s-static.ak.facebook.com https://tautt.zendesk.com; object-src 'none'";
Check the Content-Security-Policy. You may need to add the source reference.
I managed to allow all my requisite sites with this header:
header("Content-Security-Policy: default-src *; style-src 'self' 'unsafe-inline'; font-src 'self' data:; script-src 'self' 'unsafe-inline' 'unsafe-eval' stackexchange.com");
add this to nginx directives
http {
# ...
add_header Content-Security-Policy "
default-src 'self' myDomain.com *.myDomain.com;
script-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' tagmanager.google.com www.googletagmanager.com *.googletagmanager.com www.google-analytics.com ssl.google-analytics.com;
style-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' tagmanager.google.com fonts.googleapis.com www.googletagmanager.com *.google-analytics.com *.googletagmanager.com;
img-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' ssl.gstatic.com www.gstatic.com www.google-analytics.com;
font-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' fonts.gstatic.com data;
connect-src 'self' myDomain.com *.myDomain.com 'unsafe-inline' *.google-analytics.com *.analytics.google.com *.googletagmanager.com ww.google-analytics.com;
";
# ...
}
but its for development purposes for production make sure remove all 'unsafe-inline's
You can fix via adding code in htaccess
<IfModule mod_headers.c>
# Feature-Policy
Header set Feature-Policy "microphone 'none'"
# Referrer-Policy
Header set Referrer-Policy "same-origin"
# Content-Security-Policy
Header set Content-Security-Policy "script-src 'self' 'unsafe-inline' 'unsafe-eval' e.g. https://ajax.googleapis.com https://ssif1.globalsign.com https://malsup.github.io https://seal.globalsign.com https://www.googletagmanager.com https://www.google.com https://www.gstatic.com https://assets.zendesk.com https://chimpstatic.com https://cdn.ywxi.net https://static.hotjar.com https://maxcdn.bootstrapcdn.com https://www.google-analytics.com https://static.zdassets.com https://connect.facebook.net https://script.hotjar.com https://*.livechatinc.com; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdnjs.cloudflare.com https://ajax.googleapis.com;"
# X-XSS-Protection
Header set X-XSS-Protection "1; mode=block"
</IfModule>
!!ONLY FOR DEBUGGING!!
Do this only temporarily if really necessary at all, as this makes your browser vulnerable on all sites!
You can disable them in your browser.
Firefox
Type about:config in the Firefox address bar and find security.csp.enable and set it to false.
Chrome
You can install the extension called Disable Content-Security-Policy to disable CSP.