web-dev-qa-db-fra.com

L'URL d'origine n'est pas autorisée par Access-Control-Allow-Origin

J'essaie d'obtenir un taux de change avec le Google Currency Calculator en utilisant le code jquery (factice) suivant:

    $.getJSON("http://www.google.com/ig/calculator?hl=en&q=1" + "DOP" + "=?" + "USD",
        function(data) {
            $('.currNumber').each(function (index) {
                $(this).html(parseFloat($(this).html()) * 0.02681);
                                  });
          });

XMLHttpRequest ne peut pas se charger http://www.google.com/ig/calculator?hl=en&q=1DOP=?USD . L'origine 'hostURL' n'est pas autorisée par Access-Control-Allow-Origin.

En consultant le site, j'ai trouvé divers sujets sur le sujet, mais ils se réfèrent principalement à l'accès aux fichiers locaux et tentent de le résoudre en démarrant chrome avec un paramètre supplémentaire (j'utilise également Chrome) mais ce n'est pas mon problème, qui semble en fait plus lié aux restrictions interdomaines.

Donc, la question est: comment puis-je utiliser jQuery pour obtenir le taux de cette URL?

jqueryjsoncross-domain
13
PedroC88

Les demandes Ajax sont limitées par le navigateur même politique d'origine . En un mot, cela signifie que vous ne pouvez pas parler directement à un serveur via ajax qui n'est pas sur le même domaine que la page dans laquelle votre script s'exécute. Donc, à moins que vous ne développiez une page pour google.com, vous ne peut pas parler directement à google.com.

Il existe des solutions à cette limitation impliquant l'insertion de balises de script (les fichiers JS chargés via des balises de script ne sont pas soumis à la même politique d'origine), puis l'utilisation de rappels JSONP pour communiquer les résultats des données à votre script principal à partir de ces balises de script. C'est probablement ce que vous devez faire ici si l'API que vous essayez d'utiliser le prend en charge.

jQuery vous aidera beaucoup ici car il peut automatiquement transformer un appel ajax en un appel JSONP qui est chargé via des balises de script et peut fonctionner dans des situations interdomaines. Selon le doc jQuery pour sa fonction ajax , il le fera automatiquement s'il voit "callback =" dans la chaîne de paramètres de l'appel ajax ou si vous définissez l'option crossDomain.

17
jfriend00

Il semble à partir de ce lien - http://api.jquery.com/jQuery.ajax/ - qui a été fourni plus tôt par jfriend00 - explique un paramètre que vous pouvez inclure dans la requête ajax JQuery appelé "crossDomain" qui est un booléen.

crossDomain (par défaut: false pour les demandes du même domaine, true pour les demandes interdomaines) Type: booléen Si vous souhaitez forcer une demande crossDomain (telle que JSONP) sur le même domaine, définissez la valeur de crossDomain sur true. Cela permet, par exemple, la redirection côté serveur vers un autre domaine. (version ajoutée: 1.5)

Par conséquent, le définir sur true devrait résoudre (?) Ce problème. Je ne suis pas un expert, mais je l'ai essayé après avoir rencontré en permanence ce problème et cela semblait résoudre le problème.

Exemple:

$.ajax({ //my ajax request
        url: "_URL_I_AM_MAKING_REQUEST_TO_",
        type: "GET",
        cache: false,
        dataType: "json",
        **crossDomain: true,**
        data: { _mydata_
        success : function(response){}
});
2
Adam

Modifier
Je pensais que le problème était clair, mais il semble que ce ne soit pas le cas. Cette erreur que vous voyez est le serveur qui empêche votre domaine d'accéder à ses ressources via des requêtes ajax. C'est sécurité JavaScript standard - votre script ne peut parler qu'au domaine dont il est issu. Étant donné que votre JavaScript n'a pas été chargé à partir des domaines de Google, il ne figure pas dans la liste des domaines autorisés à accéder à l'API de la calculatrice via ajax et c'est pourquoi vous voyez ce message d'erreur.

Les options pour effectuer des demandes interdomaines avec jQuery sont décrites ici . Comme je l'ai mentionné précédemment, JSONP ne sera une option valide que si le serveur le prend en charge car il doit renvoyer le JSON correctement formaté.

Il pourrait être utile de fournir des liens vers les pages auxquelles vous faites référence.

D'après l'apparence des choses, cette API ne prend pas en charge JSONP (sauf s'il existe un paramètre non documenté) qui est à peu près votre seule option pour le domaine croisé ajax demande dans ce cas puisque vous ne contrôlez pas le serveur et ne pouvez pas changer le en-têtes de contrôle d'accès .

Vous voudrez peut-être envisager de créer une ressource côté serveur qui accédera à cette API pour vous sans être contraint par le modèle de sécurité JavaScript tel que le script PHP ici .

2
no.good.at.coding

Petit point d'information supplémentaire.

Je suis arrivé à cette question parce que j'ai eu cette erreur en essayant de publier sur mon propre serveur.

Solution: assurez-vous que le nom d'hôte correspond à l'appel ajax.

Exmaple:

//This failed

$.post("http://domain.com/index.php/count/",

//This succeeded (the page this was called from was www.domain.com/.....)

$.post("http://www.domain.com/index.php/count/",
1
ssaltman