Was ist eine undurchsichtige Antwort und welchen Zweck erfüllt sie?

Ich habe versucht, fetchdie URL einer alten Website aufzurufen, und es ist ein Fehler aufgetreten:

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.

Ich habe die Nachricht verstanden und versucht, eine Anfrage zu stellen, die eine undurchsichtige Antwort zurückgibt:

fetch("http://xyz", {'mode': 'no-cors'})

Ok, es funktioniert jetzt ... aber ich kann es nicht lesen. = \

Was ist dann der Zweck einer undurchsichtigen Reaktion?

Stellen Sie sich den Fall vor, in dem ein Servicemitarbeiter als agnostischer Cache fungiert. Ihr einziges Ziel ist es, die gleichen Ressourcen bereitzustellen, die Sie vom Netzwerk erhalten würden, jedoch schneller. Natürlich können Sie nicht sicherstellen, dass alle Ressourcen Teil Ihres Ursprungs sind (z. B. Bibliotheken, die von CDNs bereitgestellt werden). Da der Servicemitarbeiter das Potenzial hat, Netzwerkantworten zu ändern, müssen Sie sicherstellen, dass Sie weder am Inhalt der Antwort noch an deren Kopfzeilen oder sogar am Ergebnis interessiert sind. Sie interessieren sich nur für die Antwort als Black Box, um sie möglicherweise zwischenzuspeichern und schneller bereitzustellen.

Dafür { mode: 'no-cors' }wurde gemacht.

Auf undurchsichtige Antworten kann nicht über JavaScript zugegriffen werden. Sie können sie jedoch mit der Cache-API zwischenspeichern und im fetchEreignishandler eines Servicemitarbeiters mit ihnen antworten . Sie sind daher nützlich, um Ihre App offline zu schalten, auch für Ressourcen, die Sie nicht steuern können (z. B. Ressourcen auf einem CDN, für die die CORS-Header nicht festgelegt sind).

Es gibt auch eine Lösung für die Node JS-App. CORS Anywhere ist ein NodeJS-Proxy, der der Proxy-Anforderung CORS-Header hinzufügt.

Die URL zum Proxy wird buchstäblich aus dem Pfad genommen, validiert und als Proxy verwendet. Der Protokollteil des Proxy-URI ist optional und standardmäßig "http". Wenn Port 443 angegeben ist, ist das Protokoll standardmäßig "https".

Dieses Paket enthält keine Einschränkungen für die http-Methoden oder -Header, mit Ausnahme von Cookies. Das Anfordern von Benutzeranmeldeinformationen ist nicht zulässig. Die App kann so konfiguriert werden, dass ein Header zum Proxying einer Anforderung erforderlich ist, um beispielsweise einen direkten Besuch des Browsers zu vermeiden. https://robwu.nl/cors-anywhere.html

Javascript ist etwas schwierig, um die Antwort zu erhalten. Ich habe es behoben, indem ich die API vom Backend abgerufen und dann zum Frontend aufgerufen habe.

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;

}