Improve documentation for no-cors mode

[wbamberg]

Fixes #35488.

The immediate thing here is that you can't set Range when making a no-cors request, even though Range is a CORS-safelisted request header. So everywhere that we said "with no-cors, you can only set CORS-safelisted request headers" needed to be updated.

I didn't want to duplicate these details too much and wasn't sure where to put them. There are three pages I could see that needed updating:

• the Fetch guide
• the page for RequestInit
• the page for Request.mode
  

I ended up putting most of the details in RequestInit, because that's the point where you set mode, and because you're more likely to get to that page from (especially) the service worker documentation. Request.mode is just a read-only reflection of the value set in RequestInit.

I also tried to update no-cors to explain what it actually does, what the implications of using it are (especially, what an opaque response is), and when you might want to use it. It seems like a lot of people are confused about it, thinking it's a way to get around CORS errors, which it really isn't.

Sources:

• https://stackoverflow.com/questions/43262121/trying-to-use-fetch-and-pass-in-mode-no-cors
• https://stackoverflow.com/questions/39109789/what-limitations-apply-to-opaque-responses/39109790#39109790
• https://developer.chrome.com/docs/workbox/caching-resources-during-runtime/#opaque_responses

[github-actions]

Preview URLs

• /en-US/docs/Web/API/Fetch_API/Using_Fetch
• /en-US/docs/Web/API/Request/mode
• /en-US/docs/Web/API/RequestInit

(comment last updated: 2024-10-24 17:23:58)

[sideshowbarker]

👍 Really nice additions/changes

[wbamberg]

👍 Really nice additions/changes

<3 I copied a lot of it from your SO answers, so thank you for those!