在 jQuery 中使用 $.getJSON() 时出现问题

Question

我正在尝试运行以下命令：

$.getJSON('http://services.digg.com/2.0/story.getTopNews?limit=25&callback=?', function(data) {
    console.log(data);
});

但我得到：

story.getTopNews:-1Resource 解释为脚本，但使用 MIME 类型 application/json 进行传输。 Story.getTopNews:2Uncaught SyntaxError: 意外的标记：

我也尝试过类似的操作：

var url = "http://services.digg.com/2.0/story.getTopNews?limit=25";

$.ajax({
    url: url,
    crossDomain:true,
    dataType: "json",
    success:function(data,text,xhqr) {
        console.log(data);
    }
});

我得到这个：

XMLHttpRequest 无法加载 http://services.digg.com/2.0/story.getTopNews?limit=25。 Access-Control-Allow-Origin 不允许来源 http://sumews.com。 services.digg.com/2.0/story.getTopNews?limit=25GET http:// services.digg.com/2.0/story.getTopNews?limit=25 未定义（未定义）

任何帮助将不胜感激。

Answer 1

同源策略不允许跨域 AJAX 请求。这意味着您无法以正常方式执行跨域请求，这也是第二个示例中出现错误的原因。

在第一个示例中，您正在尝试解决方法——JSONP。这是通过将 script 元素放入引用外部脚本的页面来实现的。外部脚本必须通过将数据包装在函数调用中来做出响应。如果外部脚本不支持执行此操作（而且似乎 digg 不支持），则您无法使用 JSONP 解决方法。

由于服务器发送 JSON 数据（因为它不支持 JSONP），因此当您的浏览器尝试将其解析为常规 Javascript 时，它会感到困惑。这是您第一个错误的原因。

---

看来digg确实支持JSONP，但它需要一个额外的参数type =javascript：

$.getJSON('http://services.digg.com/2.0/story.getTopNews?limit=25&type=javascript&callback=?', function(data) {
    console.log(data);
});

这对我有用。