Qu'est-ce qu'une réponse opaque et à quoi sert-elle?

172

J'ai essayé fetchl'URL d'un ancien site Web et une erreur s'est produite:

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.

J'ai compris le message et j'ai essayé de faire une requête qui renvoie une réponse opaque:

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

Ok, ça marche maintenant ... mais je ne peux pas le lire. = \

À quoi sert alors une réponse opaque?

Miguel Angelo
la source

Réponses:

149

Prenons le cas où un service worker agit comme un cache agnostique. Votre seul objectif est de servir les mêmes ressources que celles que vous obtiendriez du réseau, mais plus rapidement. Bien sûr, vous ne pouvez pas garantir que toutes les ressources feront partie de votre origine (considérez les bibliothèques servies à partir de CDN, par exemple). Comme le technicien de service a le potentiel de modifier les réponses du réseau, vous devez garantir que vous n'êtes pas intéressé par le contenu de la réponse, ni par ses en-têtes, ni même par le résultat. Vous n'êtes intéressé que par la réponse sous forme de boîte noire pour éventuellement la mettre en cache et la servir plus rapidement.

C'est pour ça que ça a { mode: 'no-cors' }été fait.

Salva
la source
2
Mais le Status codeest toujours 0, comment vérifier si cela a réussi si status is never 200?
Angshuman Agarwal
3
Vous ne pouvez pas. Cela fait partie de la boîte noire .
Salva
67

Les réponses opaques ne sont pas accessibles par JavaScript, mais vous pouvez toujours les mettre en cache avec l' API Cache et y répondre dans le fetchgestionnaire d'événements dans un service worker. Ils sont donc utiles pour rendre votre application hors ligne, également pour les ressources que vous ne pouvez pas contrôler (par exemple, les ressources sur un CDN qui ne définit pas les en-têtes CORS).

Marco
la source
1

Il existe également une solution pour l'application Node JS. CORS Anywhere est un proxy NodeJS qui ajoute des en-têtes CORS à la requête mandatée.

L'URL du proxy est littéralement extraite du chemin, validée et proxy. La partie protocole de l'URI mandaté est facultative et est définie par défaut sur "http". Si le port 443 est spécifié, le protocole par défaut est "https".

Ce package n'impose aucune restriction sur les méthodes ou en-têtes http, à l'exception des cookies. La demande d'informations d'identification utilisateur n'est pas autorisée. L'application peut être configurée pour exiger un en-tête pour envoyer une demande par proxy, par exemple pour éviter une visite directe depuis le navigateur. https://robwu.nl/cors-anywhere.html

NinjaG
la source
-2

javascript est un peu difficile à obtenir la réponse, je l'ai corrigé en récupérant l'API du backend puis en l'appelant au 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;

}
Marcos Chacaliaza Altamirano
la source