Question

以下是我正在玩的代码片段：

$.get('http://www51.zippyshare.com/d/70229620/44835/data.json', function (data) {
console.log(data);
}).fail(function () {
console.log('I failed to download json')
});

不幸的是，每次都无法下载该文件并记录消息。

为什么不下载该文件？

Answer 1

这与跨域请求有关。在某些浏览器中，如果目标文件位于您当前所在的域的另一个域上，则安全性设置为无法通过javascript检索JSON（或其他文件）的级别。在chrome中我收到以下错误：

XMLHttpRequest cannot load http://www51.zippyshare.com/d/70229620/44835/data.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://xxx.xxx.xxx.xxx' is therefore not allowed access.

解决这个问题的一种方法是使用JSONP，它旨在避免此问题。您需要控制所请求文件的输出。因此，在您的情况下（从zippyshare获取json文件）如果相关文件是动态文件，这可能会变得非常复杂。

这是一个小的JSONP示例：

$.ajax({
   type: 'GET',
    url: "http://www51.zippyshare.com/d/70229620/44835/data.json",
    async: false,
    jsonpCallback: 'jsonCallback',
    contentType: "application/json",
    dataType: 'jsonp',
    success: function(json) {
       console.log(json.data);
    },
    error: function(e) {
       console.log(e.message);
    }
});

现在将data.json内容包装到函数调用中非常重要，如下所示：

jsonCallback(
  {
    "data": "value"
  }
);

可在此处找到更多信息和说明：http://www.jquery4u.com/json/jsonp-examples/

无法使用jQuery下载文件

1 个答案: