Impossible de charger Google images à partir de son API en utilisant jQuery getJSON

Question

Mon code est ci-dessous:

$.getJSON('https://ajax.googleapis.com/ajax/services/search/images?q=Google&v=1.0', 
function(json) { 
    alert(json); 
})​ 

Vous pouvez essayer ce code ici: http://jsbin.com/ofaru3/edit

Le ajax est erreur

imagesFailed pour charger des ressources

Comment cna-je résoudre ce problème? Merci!

Answer 1

Vous devez &callback=? sur l'URL là pour déclencher JSONP, comme ceci:

$.getJSON('https://ajax.googleapis.com/ajax/services/search/images?q=Google&v=1.0&callback=?', 
function(json) { 
    alert(json); 
}); 

You can test it out here. Sans le &callback?, il tente d'extraire les données d'un domaine distant avec un XmlHttpRequest (AJAX) et échoue/est bloqué en raison de la same origin policy. C'est exactement le type de situation pour lequel JSONP est.

Des $.getJSON() docs:

JSONP
Si l'URL inclut la chaîne "? Rappel =" (ou similaire, tel que défini par l'API côté serveur), la requête est traitée comme JSONP à la place. Voir la discussion sur le type de données jsonp dans $.ajax() pour plus de détails.