no-cors opaque request for html resource fetch blocked by CORB

问题

I'm trying to fetch html file located at url https://sub.app.test/html from https://app.test using no-cors mode but the response is blocked by CORB (cross-origin read blocking).

fetch('https://sub.app.test/html', { mode: 'no-cors'})

Why?

回答1:

Even though no-cors mode is used (so the response doesn't need to have Access-Control-Allow-Origin to be allowed) the request is blocked by CORB because an html content is considered a data resource (it may contain sensitive data). Any resource that has MIME type text/html (and html is sniffed in response body or X-Content-Type-Options: nosniff is set) will be blocked by CORB so that sensitive data cannot be leaked using speculative side-channel attacks like Spectre vulnerabilities (the resource won't be added to the site renderer's memory).

There are a few ways to bypass this constraint:

• serve the resource from the same origin (app.test)
• use cors mode (server needs to add correct Access-Control header)
• change MIME type to something other than text/html or don't set the header at all (hacky)

read more:

• https://chromium.googlesource.com/chromium/src/+/master/services/network/cross_origin_read_blocking_explainer.md
• https://www.chromium.org/Home/chromium-security/corb-for-developers

来源：https://stackoverflow.com/questions/54910853/no-cors-opaque-request-for-html-resource-fetch-blocked-by-corb