web-dev-qa-db-fra.com

Concept de partage de ressources d'origine croisée (CORS)

J'ai une question sur le concept JavaScript interdomaine.

Il existe un serveur (ex-Amazon.com) dans lequel seuls les domaines sélectionnés peuvent utiliser leur service Web . Donc, si je tente d'utiliser leur service, depuis mon site local, je ne le peux pas. Je l'ai sur ma console 

Demande d'origine croisée bloquée: la règle de même origine interdit la lecture la ressource distante à http://football20.myfantasyleague.com/2014/export?TYPE=rosters&L=52761&W=&JSON=0 . Cela peut être corrigé en déplaçant la ressource vers le même domaine ou permettant à CORS.

PS: J'ai aussi utilisé jquery cross domain, mais ça n'a pas fonctionné.

Mais si un domaine qui figure parmi ceux sélectionnés, pour utiliser le service Web d'Amazon, a un JavaScript, qui fonctionne si nous l'incluons dans notre code HTML.

<script src="http://example.com"></script>

Ils ont une méthode pour obtenir une réponse par Ajax.

Mes questions sont:

  1. Que se passe-t-il lorsque nous référons un fichier JavaScript à partir d'une URL Internet? Avons-nous une copie locale en cours d'exécution sur notre machine?
  2. Le httpRequest est créé, aura une source de demande comme mon domaine ou le xyz.
javascriptjqueryajaxcors
15
Sashi Kant

CORS est un paramètre qui doit être modifié sur le serveur. Il permet aux ressources d'une page Web d'être demandées par un domaine externe. Changer simplement votre code sur le client ne changera pas les fonctionnalités de CORS. 

La raison pour laquelle vous pouvez accéder à une page à partir d'une balise "script" est que les balises sont traitées différemment de toutes les autres données pour les demandes croisées d'origine. Auparavant, vous pouviez "pirater" CORS sur votre système en utilisant JSONP qui stockait les données JSON dans des balises HTML.

Pour activer CORS dans Apache:

Commencez par trouver votre httpd.conf en tapant 

ps -ef | grep Apache

Ce qui vous donnera l'emplacement d'Apache. Une fois que vous avez trouvé ce type: 

 <Apache-location> -V

Ce qui retournera l'emplacement exact de votre httpd.conf comme ceci: 

 -D SERVER_CONFIG_FILE="/etc/Apache2/Apache2.conf"

Vous devez maintenant aller à httpd.conf et taper "/" pour rechercher <directory>. Une fois que vous avez trouvé le tag, juste après, tapez:

Header set Access-Control-Allow-Origin "*"

Enregistrez le fichier et confirmez que la syntaxe est correcte en exécutant:

apachectl -t

Si cela se vérifie, exécutez la commande de redémarrage en douceur:

apachectl -k graceful

Une fois le serveur redémarré, vos fichiers devraient maintenant être accessibles via des scripts externes.

Si vous ne parvenez pas à enregistrer la configuration à cause d’une erreur, essayez de quitter votre éditeur et de taper:

Sudo chmod 755 httpd.conf

Cela donne au propriétaire un accès complet au fichier de configuration, mais tout le monde ne peut que lire et exécuter ( http://en.wikipedia.org/wiki/Chmod ).

Pour tester ces modifications, créez un nouveau fichier index.html sur un serveur externe et chargez-le avec les éléments suivants:

<!doctype html>
<html>
    <head>
    <title>TEST</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.js"></script>
    <script src="http://code.jquery.com/jquery-1.11.1.js"></script>
    <!-- Insert Scripts & CSS Here -->
    <link rel="stylesheet" type="text/css" href="http://d1e24pw9mnwsl8.cloudfront.net/c/bootstrap/css/bootstrap.min.css">
    </head>

    <body>

        <script>
        jQuery.get('yourwebsite.com/file.csv', function(data) {
        document.write(data);
        });
        </script>

    </body>

</html>

La sortie résultante doit refléter le flux de données en direct sur votre sitewebsite.com/file.csv.

Si le chargement de cette page html ne montre aucune sortie, appuyez sur f12 sur Firefox pour ouvrir la console du développeur. Très probablement, vous verrez une erreur:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at yourwebsite.com/file.csv. This can be fixed by moving the resource to the same domain or enabling CORS.

Cela signifie soit a) que votre httpd.conf n'a pas été configuré correctement/n'a pas été sauvegardé, ou b) vous avez oublié de redémarrer le serveur Web. 

3
Andrew

Dans le fichier .htaccess, ajoutez simplement cette ligne:

Header set Access-Control-Allow-Origin *
0
Shafiq