What is an opaque response and what purpose does it serve

Question

I tried to fetch the URL of an old website  and an error happened   Fetch API cannot load http   xyz  No  Access-Control-Allow-Origin  header is present on the requested resource  Origin  http   abc  is therefore not allowed access  If an opaque response serves your needs  set the request s mode to  no-cors  to fetch the resource with CORS disabled    I understood the message  and tried to do a request that returns an opaque response   fetch  http   xyz     mode    no-cors      Ok  it now works    but I can t read it      What s the purpose then  of an opaque response

User · Answer

Opaque responses can t be accessed by JavaScript  but you can still cache them with the Cache API and respond with them in the fetch event handler in a service worker  So they re useful for making your app offline  also for resources that you can t control  e g  resources on a CDN that doesn t set the CORS headers

User · Answer

Consider the case in which a service worker acts as an agnostic cache  Your only goal is serve the same resources that you would get from the network  but faster  Of course you can t ensure all the resources will be part of your origin  consider libraries served from CDNs  for instance   As the service worker has the potential of altering network responses  you need to guarantee you are not interested in the contents of the response  nor on its headers  nor even on the result  You re only interested on the response as a black box to possibly cache it and serve it faster   This is what   mode   no-cors    was made for

User · Answer

javascript is a bit tricky getting the answer  I fixed it by getting the api from the backend and then calling it to the frontend   public function get typechange             url    https                    json   file get contents   url         data   json decode    json  true         resp   json encode   data         error   json last error msg         return   resp

User · Answer

There s also solution for Node JS app  CORS Anywhere is a NodeJS proxy which adds CORS headers to the proxied request   The url to proxy is literally taken from the path  validated and proxied  The protocol part of the proxied URI is optional  and defaults to  http   If port 443 is specified  the protocol defaults to  https    This package does not put any restrictions on the http methods or headers  except for cookies  Requesting user credentials is disallowed  The app can be configured to require a header for proxying a request  for example to avoid a direct visit from the browser  https   robwu nl cors-anywhere html

[cors] What is an opaque response, and what purpose does it serve?

Examples related to cors

Examples related to fetch-api