Firefox 68 is refusing to load scripts if strict-dynamic is set. Removing it fixes the problem but I'm trying to figure out why strict-dynamic causes Firefox to block the scripts. (There are no errors in Chrome 76 or 77.)
Here is my current CSP:
default-src 'none';
base-uri 'self';
connect-src https://api.[mysite].com;
font-src 'self' https://use.typekit.net;
form-action 'self';
frame-ancestors 'self';
img-src 'self' data:;
manifest-src 'self';
object-src 'none';
script-src 'self' 'unsafe-inline' https: 'sha384-iNlFf0Eg2hINxMB9tToQV4RnxDkAZlsPP94pWd15ctvGZBv9ryRfQqFtFZNM7XiA' 'sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49' 'sha384-ZDHQDqvUUYauNA9cFuoaV9L+U+ZtxzdGF70k0b7fDra3FBacCe+Hngtw49T6CJb7' 'sha384-rNVOlvKt+mE/FuEDamC09wqzy3DjyosfTPCDkViitrbSMgS05HdT7pLifJLUpKkN' 'sha384-WCO1dM1VIjdz4wJR0FG7yGtGylSMdwCQDP5MoFjrc/u8970XcFh6zwXdjG76eCDS' 'sha384-+N7evcl7zrc6o9kMNnhuSkeAgOTW8X1IJ9QNoUeFg1Nk2F9iePwtyeN23Xmrfvl8' 'sha384-AQ+OmaAwyCDPM0nqlDUkKMa3qkWQ3oi/reAOFXu3Qpj+8qSrRlqoFd18NNJbOZVT' 'sha384-OAeN05/PeTav9WcYPjJBUnayKJllw2VgLFEpNY5rRWciopAb4v1ERIKclCaF6J/4' 'sha256-kzvsAqTDCfIphFz0XiR4pT52mnhHbvon43SO5jB18dk=' 'sha384-+StHyFUD2Qm2XSU/KU8ItNOwDenBX7rmg1dlwv/d2/UScI4z1E4NleDCQxN5bGFg' 'sha512-4SOBW3M7cPHveemHR+3DE/wa2TMg+IrV5KbofseWTiJdRGhP5fPy9kNGgHMnw3x7KuWuIqeY4O/jFFL8gio9Ag==' 'sha256-1qUviT9v0xAXIG4t/jw+97tZmTnpSdX/kJ2TZBkMBVA=' 'sha384-1oQ+rlRG29IUmyXJ19qy/3JkdRgR+FYDwdljaRj7hFK46jWfXOttNyJ6lgJIiYmx' 'sha512-+t+Sm1j5Sr1ZuxzwvYlZbZw+wODnAGe/YPgZ7BE00ZWwp6Ct5FKWt4EybojdgUxYrzaM20OBZ2I1Uh4U9Vl6WA==' 'strict-dynamic' 'report-sample';
style-src 'self' 'unsafe-inline' https://use.typekit.net/ldr0egh.css https://p.typekit.net 'report-sample';
report-uri https://[mysite].report-uri.com/r/d/csp/reportOnly;
report-to default
I would expect that Firefox would load the scripts since the hashes match. But with strict-dynamic enabled it chokes. Is this a bug in Firefox? Or do I need to be doing my CSP differently?
The errors in Firefox are:
Content Security Policy: The page's settings observed the loading of a resource at https://[mysite]/scripts/js/jquery.min.js ("script-src"). A CSP report is being sent.
Content Security Policy: The page's settings observed the loading of a resource at https://[mysite]/scripts/js/popper.min.js ("script-src"). A CSP report is being sent.
Content Security Policy: The page's settings observed the loading of a resource at https://[mysite]/scripts/js/bootstrap.min.js ("script-src"). A CSP report is being sent.
The hashes for the above resources are (the first three in script-src):
sha384-iNlFf0Eg2hINxMB9tToQV4RnxDkAZlsPP94pWd15ctvGZBv9ryRfQqFtFZNM7XiA
sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49
sha384-ZDHQDqvUUYauNA9cFuoaV9L+U+ZtxzdGF70k0b7fDra3FBacCe+Hngtw49T6CJb7
Support for hashes on external scripts was added in CSP Level 3 and is not implemented yet in Firefox.
Related
I want to add an iframe into my html page.
The reason for this is to, hopefully, be able to set values into the "localstorage" for that iframe / sub-domain.
I put the tag for the iframe like so: <iframe src="https://yt.localtest.me"></iframe>.
Then I add the following inside the head of the page: <meta http-equiv="Content-Security-Policy" content="frame-src 'self' *.localtest.me"> + I have tried many other variations of this.
The "Web developer tools" only gives me the following information: Content Security Policy: The page’s settings blocked the loading of a resource at https://yt.localtest.me/ (“frame-src”)..
There are never any requests going to this sub-domain as far as I can see. But in I have removed the "x-frame-options" returned by Nginx which was set to "Deny".
Why am I seeing this error, and how can I fix it?
Btw, I am seeing this on both Firefox and Chrome.
Response headers for the containg page is:
HTTP/2 200 OK content-type: text/html; charset=utf-8 date: Thu, 05 Jan 2023 12:55:59 GMT server: Kestrel x-frame-options: DENY x-xss-protection: 1; mode=block x-content-type-options: nosniff strict-transport-security: max-age=31536000 referrer-policy: strict-origin-when-cross-origin content-security-policy: script-src 'self' https://cdn.jsdelivr.net 'nonce-Hc3huW7RDIa1gqTxo/n05+MhyPwBpRiokpv12+2uNN4='; default-src 'self'; frame-src https://cdn.jsdelivr.net; img-src 'self' https://cdn.jsdelivr.net data:; style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net; base-uri 'none'; font-src 'self' https://cdn.jsdelivr.net; connect-src 'self' * ws: wss: localhost:* localtest.me:* X-Firefox-Spdy: h2
What happens if you don't add the meta tag with CSP? Do you get the same error message?
I think the most likely explanation is another CSP, likely set in a response header, and that you try to amend this by adding another policy. But another policy can only add restrictions, not loosen any set by another policy. If this is the case, you should change or remove the CSP set in the response hader and remove the meta version if necessary.
Hello everybody thanks for reading.
I have a problem with Ckeditor, Now i use Content-Security-Policy and editor do not show buttons like the image
if i delete this line
Header always set Content-Security-Policy: "style-src 'self' www.site.com; child-src https://www.youtube.com"
work good
now what can i do , do you have a idea? Please help me, thanks a lot.
To publish CSP via the Header always set Content-Security-Policy:... is not good idea.
Such CSP header will be sent with any content: .js, .css, .jpeg and word always means that it will be send not only with pages having '200 OK' status, but for Error / Redirect / Not Modified / etc.
You have no flexibility to manage such header. If your web page will publish own Content-Security-Policy header, for example via PHP header("Content-Security-Policy: default-src 'self';", you will have 2 glued CSP headers with unpredictable consequences.
In your case - you do not need to publish CSP header in the admin panel (where you do use Ckeditor). But due to para 2 of above, you have the CSP header everywhere and have no possibility to switch it off.
Mush better to use some plugins for your CMS for CSP header management. Such plugins smart enough and do not publush CSP in the admin panel and for error/redirect pages.
If you do not use CMS, you can publish CSP, for example via header() PHP function in appropriate index.php (since you use Ahache web server).
PS: If you do use CKeditor in the site (non in the admin) - you need to expand your CSP rules to allow CKeditor scripts and styles.
UPDATE
Judging by the comments, webmasters are having difficulties with CSP for CKEditor, but no one said which version: 4 or 5.
Content Security Policy for Ckeditor-4 if it's loaded from cdn.ckeditor.com CDN:
connect-src https://pdf-converter.cke-cs.com;
form-action 'self';
img-src cdn.ckeditor.com;
script-src 'unsafe-inline' cdn.ckeditor.com;
style-src 'unsafe-inline' cdn.ckeditor.com;
* SKE-4 is incompatible with 'nonce-value' and requires mandatory 'unsafe-inline' because a lot of inline scripts.
Content Security Policy for Ckeditor-5 if it's loaded from cdn.ckeditor.com CDN:
connect-src https://docx-converter.cke-cs.com https://pdf-converter.cke-cs.com;
form-action 'self';
script-src 'unsafe-inline' https://cdn.ckeditor.com/ckeditor5/;
style-src 'unsafe-inline';
* SKE-5 scripts are compatible with 'nonce-value' so you can get rid of 'unsafe-inline' in script-src.
Content Security Policy for Ckeditor-5 if it's loaded from server where site is placed:
connect-src https://docx-converter.cke-cs.com https://pdf-converter.cke-cs.com;
form-action 'self';
script-src 'self' 'unsafe-inline';
style-src 'unsafe-inline';
PS: The connect-src https://docx-converter.cke-cs.com https://pdf-converter.cke-cs.com; is required only if "Export to PDF" and "Export to Word" buttons are used.
if use nonce, I do like this
(function(cke) {
var _owrite = cke.dom.document.prototype.write;
cke.dom.document.prototype.write = function(src) {
src = src.replace(/<script/gmi, '<script nonce="' + nonceValue + '"');
_owrite.apply(this, [src]);
};
})(CKEDITOR);
A simple solution i used in my project after several fail trials to whitelist Ckeditor, is to exclude CSP urls prefixes that going to use rich text editor.
In my case it was the product admin page.
I have a web server that generates a http/html response to a GET request. I have added the following response header: content-security-policy: default-src 'nonce-Z2lnkA9A00KuJsXvx94P6hyDdyRUaxFCiV9lUS0XgWo' 'self' *.my-org.net *.my-org.com fonts.googleapis.com fonts.gstatic.com *.amazon.com;.
I then add the following tags to my html document:
<!-- these tags are blocked in firefox -->
<style nonce="Z2lnkA9A00KuJsXvx94P6hyDdyRUaxFCiV9lUS0XgWo"> some inline code ....
<script nonce="Z2lnkA9A00KuJsXvx94P6hyDdyRUaxFCiV9lUS0XgWo"> some inline code ....
<!-- this tag works as expected in all browsers-->
<script src="/scripts/utils.js"></script>
This code executes correctly in chrome and edge, but firefox is blocking the inline script tags, while allowing the fetched script tags to execute.
The error in the firefox console is: Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”).
It seems like Firefox doesn't support nonces in default-src. If you specify the script-src and style-src directives with the necessary sources it should work. I tested this with Firefox 77 and 79.
When executing my asp.net core 2.1 application, I get the following error in the console tab of firefox browser: This is showing as 400 Bad request in the Network tab.
Firefox can’t establish a connection to the server at ws://localhost:58330/sockjs-node/775/15qeeqvw/websocket.
I believe I missing some CSP related entries to my meta tag but not sure which one. Below is my csp meta tag:
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' http://localhost:58330/ 'unsafe-eval'; connect-src 'self' 'unsafe-eval'; img-src 'self'; style-src 'self' 'unsafe-inline';">
Can anyone please assist?
Thanks,
Hemant.
I have made a browser extension for both chrome and firefox. The firefox one is developed using Web Extension APIs and so there are minimal code differences in these two extensions. As an important feature in the extension, some HTML elements become part of the webpage through Content Scripts. That also involves loading images which are hosted on some server and served over https. Now, these images are loading fine in chrome when the extension is running on top of twitter and github. But, interestingly, images are not loading at all in firefox when the corresponding extension is running over twitter and github. Even more interesting is the fact that the content-script-policy set by twitter in its response header is prohibiting that image load and hence firefox is behaving correctly. So, my question basically is if Chrome is violating the CSP here?
Attaching the csp set by twitter here--
script-src 'nonce-j0GK1zjoBy82/ZWhR7gw+g==' https://connect.facebook.net https://cm.g.doubleclick.net https://ssl.google-analytics.com https://graph.facebook.com https://twitter.com 'unsafe-eval' https://.twimg.com https://api.twitter.com https://analytics.twitter.com https://publish.twitter.com https://ton.twitter.com https://syndication.twitter.com https://www.google.com https://t.tellapart.com https://platform.twitter.com https://www.google-analytics.com 'self'; frame-ancestors 'self'; font-src https://twitter.com https://.twimg.com data: https://ton.twitter.com https://fonts.gstatic.com https://maxcdn.bootstrapcdn.com https://netdna.bootstrapcdn.com 'self'; media-src https://twitter.com https://.twimg.com https://ton.twitter.com blob: 'self'; connect-src https://graph.facebook.com https://.giphy.com https://.twimg.com https://pay.twitter.com https://analytics.twitter.com https://media.riffsy.com https://upload.twitter.com https://api.mapbox.com 'self'; style-src https://fonts.googleapis.com https://twitter.com https://.twimg.com https://translate.googleapis.com https://ton.twitter.com 'unsafe-inline' https://platform.twitter.com https://maxcdn.bootstrapcdn.com https://netdna.bootstrapcdn.com 'self'; object-src https://twitter.com https://pbs.twimg.com; default-src 'self'; frame-src https://staticxx.facebook.com https://twitter.com https://.twimg.com https://player.vimeo.com https://pay.twitter.com https://www.facebook.com https://ton.twitter.com https://syndication.twitter.com https://vine.co twitter: https://www.youtube.com https://platform.twitter.com https://upload.twitter.com https://s-static.ak.facebook.com 'self' https://donate.twitter.com; img-src https://graph.facebook.com https://.giphy.com https://twitter.com https://.twimg.com data: https://fbcdn-profile-a.akamaihd.net https://www.facebook.com https://ton.twitter.com https://.fbcdn.net https://syndication.twitter.com https://media.riffsy.com https://www.google.com https://stats.g.doubleclick.net https://*.tiles.mapbox.com https://www.google-analytics.com blob: 'self'; report-uri https://twitter.com/i/csp_report?a=NVQWGYLXFVZXO2LGOQ%3D%3D%3D%3D%3D%3D&ro=false;
Please notice "img-src" in this. Another question that bothers me is that the extension also has its own content-script-policy specified in the manifest file. How do these two policies play together?
Extensions can override CSP of pages if they really want to, but assuming no such response-header surgery, the page's CSP is still mostly respected.
I've made a recent answer regarding CSP in extensions, and will partly reproduce it here:
There are 3 CSPs at play in extensions:
content_security_policy directive only applies for extension's own pages (such as the background page). If not specified, it defaults to script-src 'self'; object-src 'self' and has some restrictions on how it can be modified.
Content script context is not subject to this CSP. unsafe-eval is unrestricted (since you can do executeScript with arbitrary code anyway), however, inline script and remote script restrictions just don't apply to content scripts, because:
Any script in the DOM of the page, be it inline or <script src="..."> tag is executed in the context of the page itself and is subject to the CSP of the page itself. There is precisely one exception, injecting a <script> /* code */ </script> in the page will bypass inline code restrictions for immediate execution.
Note that all of this covers scripts. I am not sure how images are affected. I don't know any docs that cover this.
Note that extensions in general get to override some web security features, for example CORS.