web-dev-qa-db-fra.com

Comment utiliser Cors n'importe où pour inverser le proxy et ajouter des en-têtes CORS

Je lis depuis deux heures la documentation de ce proxy inverse pour ajouter des en-têtes CORS, et je ne peux pas l'utiliser. Pouvez-vous s'il vous plaît aider avec un exemple simple comment utiliser cela.

CORS-PARTOUT

J'ai essayé cet exemple dans un javascript

(function() {
var cors_api_Host = 'cors-anywhere.herokuapp.com';
var cors_api_url = 'https://' + cors_api_Host + '/';
var slice = [].slice;
var Origin = window.location.protocol + '//' + window.location.Host;
var open = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function() {
    var args = slice.call(arguments);
    var targetOrigin = /^https?:\/\/([^\/]+)/i.exec(args[1]);
    if (targetOrigin && targetOrigin[0].toLowerCase() !== Origin &&
        targetOrigin[1] !== cors_api_Host) {
        args[1] = cors_api_url + args[1];
    }
    return open.apply(this, args);
};
})();

Je ne comprends pas vraiment si j'ai besoin de node.js ou quoi exactement

javascriptcorscors-anywhere
11
Stranger B.

CORS Anywhere permet d'accéder aux données d'autres sites Web, ce qui est normalement interdit par la même politique d'origine des navigateurs Web. Cela se fait en procurant des requêtes à ces sites via un serveur (écrit dans Node.js, dans ce cas).

"Pour utiliser l'API, il suffit de préfixer l'URL avec l'URL de l'API." . C'est vraiment tout. Donc, au lieu de demander http://example.com, vous demanderez https://cors-anywhere.herokuapp.com/http://example.com. CORS Anywhere effectuera ensuite la demande au nom de votre application et ajoutera des en-têtes CORS à la réponse afin que votre application Web puisse traiter la réponse.

L'extrait de votre question modifie automatiquement l'URL des demandes générées par XMLHttpRequest si nécessaire. Cet extrait n'est pas requis, vous pouvez simplement ajouter l'URL de l'API CORS Anywhere vous-même, comme cela est fait dans la page de démonstration .

Le référentiel sur Github ( https://github.com/Rob--W/cors-anywhere ) contient le code source du serveur qui alimente CORS Anywhere. Si vous êtes un développeur front-end, c'est tout ce que vous devez savoir. Si votre application compte de nombreux utilisateurs, vous devez héberger CORS Anywhere vous-même pour éviter de consommer toutes les ressources sur le serveur public CORS Anywhere.

21
Rob W

Je m'en remets à Rob, mais voici ma tentative de réponse à votre question.

(Rob, n'hésitez pas à corriger cette réponse; et merci pour CORS Anywhere. Cela m'a récemment épargné beaucoup de problèmes.)

  1. Installez Node.js .

  2. Installer CORS Anywhere .

    Par exemple, à l'invite de commandes, entrez:

    npm install cors-anywhere

    (Cet exemple de commande installe CORS Anywhere sous le répertoire en cours, dans node_modules\cors-anywhere.)

  3. Exécutez CORS Anywhere.

    Par exemple, à l'invite de commandes, entrez:

    node cors-anywhere.js

CORS Anywhere répond avec un message comme celui-ci:

Running CORS Anywhere on 127.0.0.1:8080

(L'adresse IP 127.0.0.1 est localhost; ton ordinateur.)

Vous pouvez spécifier le port dans une variable d'environnement, mais j'ai choisi de modifier la valeur dans ma copie locale de cors-anywhere.js.

Supposons maintenant que vous souhaitiez utiliser un service Web non compatible CORS à l'URL suivante:

http://remote.server.com:8085/service

Au lieu d'utiliser cette URL d'origine, vous utilisez le domaine et le port CORS Anywhere, suivi de l'URL d'origine comme composant de chemin:

http://localhost:8080/remote.server.com:8085/service

(Vous pouvez omettre le premier http:// à partir de l'URL d'origine.)

15
Graham Hannington

Vous pouvez également vérifier cela: https://github.com/Zibri/cloudflare-cors-anywhere

Vous pouvez créer le vôtre en 3 minutes en téléchargeant le code sur un travailleur cloudflare gratuit!

0
Zibri