无法使用 jQuery getJSON 从其 API 加载 Google 图片

Question

我的代码如下：

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

你可以在这里试试这个代码：http://jsbin.com/ofaru3/edit

ajax 出错

图片加载资源失败

我该如何解决这个问题？谢谢！

Answer 1

您需要在 URL 上使用&callback=? 来触发 JSONP，如下所示：

$.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。如果没有&callback?，它会尝试使用 XmlHttpRequest (AJAX) 从远程域获取数据，并且由于same origin policy 而失败/被阻止。这正是JSONP 所针对的情况类型。

来自$.getJSON() 文档：

JSONP
如果 URL 包含字符串“callback=?” （或类似的，由服务器端 API 定义），请求被视为 JSONP。有关详细信息，请参阅 $.ajax() 中对 jsonp 数据类型的讨论。