I am developing a page and for some reason I started getting this errors on our test server (replaced its hostname for security reasons):
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”). injectGlobalHook.js:808:49
Content Security Policy: The page’s settings blocked the loading of a resource at https://example.com/admin/assets/demo/default/base/scripts.bundle.js (“script-src”).
Content Security Policy: The page’s settings blocked the loading of a resource at https://example.com/admin/runtime.4cbfbfa49b193f847ed1.js (“script-src”).
Content Security Policy: The page’s settings blocked the loading of a resource at https://example.com/admin/polyfills.7e64f3b1273a474a8867.js (“script-src”).
Content Security Policy: The page’s settings blocked the loading of a resource at https://example.com/admin/scripts.9ad8122b74233091de3d.js (“script-src”).
Content Security Policy: The page’s settings blocked the loading of a resource at https://example.com/admin/main.53084d308f02a83449d8.js (“script-src”).
The problem is that this errors happen only to me, only on firefox and only when not using incognito.
I also don't have any CSP configuration in the project.
I assume the reason is that at some point there were some CSP rules on that server and they got cached.
How can I debug the reason why I am getting those errors and where can I find the cached CSP rules?
edit:
Forgot to mention, this errors are not specific to angular.
They appear on all scripts loaded from that domain including angular page, swagger api-doc and Symfony debugger.
I just used the angular one as example.
Related
I'm writing a web media viewer for images/videos and I need to cache that media for offline use.
I have a manifest and service worker so it can be installed as a PWA, and I'm trying to cache media from a list of URLs with esentially:
let cache = await window.caches.open('pwa-assets');
for(let url of allAssetURLs) {
await cache.add(url);
}
This seems to work fine for local assets, but if those URLs are on a different domain (from a CMS/CDN) I get this CORS error.
Access to fetch at 'https://storage.googleapis.com/....appspot.com/...example.mp4' from origin 'https://127.0.0.1:4173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
Web.dev has a note that cross-domain caching is possible here, but doesn't say much about it.
The URLs I'm trying to cache are for files store in google cloud storage, for example:
https://storage.googleapis.com/....appspot.com/...example.mp4
These do work if used in <img/> or <video/> tags, so I don't think it's a CORS header issue on the CDN.
You write:
These do work if used in <img/> or <video/> tags, so I don't think it's a CORS header issue on the CDN.
Loading such subresources across origins is by default compatible with the Same-Origin Policy (SOP) and doesn't trigger CORS errors. See the relevant section of the MDN Web Docs about the SOP:
Here are some examples of resources which may be embedded cross-origin: [...]
Images displayed by <img>.
Media played by <video> and <audio>.
You write:
This seems to work fine for local assets, but if those URLs are on a different domain (from a CMS/CDN) I get this CORS error.
Invoking the add method on a Cache results in a GET request. If its argument is on a different origin, the resource in question needs to be configured for CORS or you'll get a CORS error, as you've experienced. See the note in the relevant MDN Web Docs:
Note that for opaque filtered responses [...]
we can't access to [sic] the response headers, so this check
will always fail and the font won't be cached. [...]
It is something to keep in mind if you're attempting to
cache other resources from a cross-origin domain that
doesn't support CORS, though!
You write:
The URLs I'm trying to cache are for files store in google cloud storage, for example https://storage.googleapis.com/....appspot.com/...example.mp4.
This page of the Google Storage documentation explains how to configure CORS for your bucket(s), assuming those buckets are indeed yours. Otherwise, you're out of luck and won't be able to cache those resources on the client side.
I am using this firefox addon to run javascript on sites to tweak how they work for me:
https://addons.mozilla.org/en-US/firefox/addon/codeinjector
Unfortunately on twitter I get this error:
Content Security Policy: The page's settings blocked the loading of a resource at inline ("script-src").
Is there a way I can override this in firefox settings?
Content Security Policy is a mechanism which allow a web server to specify, via HTTP headers, which source of content (scripts, images, ...) are considered safe.
As your scripts are not part of the content security policy, they are blocked by the browser, which is the intended behavior.
You can either:
Use a Firefox plugin, such as Modify Header Value, to dynamically add your script locations in the CSP rules coming from the HTTP headers.
Use the same plugin to completely remove the CSP headers. But this is means you will not be protected by CSP when browsing Twitter. This is not safe.
You can also totally disable CSP rules by disabling security.csp.enable in the about:config panel, but this is really not safe and I don't recommend it.
I am loading a js resource exposed as a openshift route on a website but getting this error - net::ERR_CERT_AUTHORITY_INVALID. The site is not able to load that resource because of this security issue. Is there a way to bypass this and how can it be done for openshift routes?
I am also getting this
Access to script at
'<js-resource>' from
origin 'http://<website>' has been
blocked by CORS policy: No 'Access-Control-Allow-Origin' header is
present on the requested resource.
Loading failed for the with source
“blob:https://connect.squareup.com/2d9347c7-e067-4ca1-9aaf-7ce2c40aec44”.
frame.html:1
Content Security Policy: The page’s settings blocked the loading of a
resource at
blob:https://connect.squareup.com/2d9347c7-e067-4ca1-9aaf-7ce2c40aec44
(“script-src 'unsafe-inline' https://browser.sentry-cdn.com”).
When will the Square developers please update their CSP policy and address other pending issues?
Content Security Policy is blocking download of a blob (csv) in an iframe on Firefox only, this works fine in Chrome... Not sure what I'm doing wrong. I've renamed the domains to make it easier to understand the parent child frame relationship.
This is the error:
Content Security Policy: The page’s settings blocked the loading of a
resource at
blob:https://mysubdomain-prod.mychilddomain.net/4663b181-76a0-dd4b-a5b2-7bbb65fd9f38
(“child-src https://mysubdomain-prod.mychilddomain.net
https://*.myparent.net”)
Firefox 54.0 on Sierra
Any ideas?