403对JSONP请求的禁止响应

Question

第一次投递到stackoverflow。

我只是试图使用jQuery从json url获取数据。第一个问题是跨源请求块，即使库应该停止这个问题，像ajax跨源js（抱歉不提供这个链接，我太新了，在这里有超过2个链接），我仍然没有运气，一样交叉原点错误。

所以我搬到了JSONP。

url = "http://take-home-test.herokuapp.com/api/v1/works.json?callback=?"
$.ajaxSetup({ dataType: "jsonp" });
$.getJSON(url, function(json) {
    console.log(data);
});

（我也尝试过JSONP请求的AJAX语法）

现在我可以在网络选项卡中看到数据正在返回，但状态是403禁止。chrome网络选项卡中响应的图片

我使用超文本传输协议-server，您可以安装npm，以避免chrome与json MIME类型有问题。类似的堆栈溢出回答说，我需要集成jsonp支持我的框架，但他们指的是sinatra的Ruby。为什么JSONP调用返回禁止403然而URL可以在浏览器中访问
所以我尝试了npmjs jsonpClient，仍然得到了禁止的响应。

有什么想法吗？这花了我一天多的时间。

Answer 1

这是我发现的最简单的代码版本，感谢Dave Meas：

url = http://take-home-test.herokuapp.com/api/v1/works.json"
new_url = "http://crossorigin.me/" + url;
$.getJSON(new_url, function(json) {
console.log(json);
});

Answer 2

问题：服务器（http://take-home-test.herokuapp.com）没有设置访问-控制-允许-起源头。如果可以访问服务器，请使用--cors选项启动服务器。也就是：节点bin/超文本传输协议-server--cors...这将通过访问-控制-允许-起源头启用CORS，并应解决您的问题。

如果您没有访问服务器的权限。这里有一个快速的解决方案：通过http://cors.io.代理您的请求。

url = 'http://take-home-test.herokuapp.com/api/v1/works.json?callback=?';
new_url = "http://cors.io/?u=" + encodeURIComponent( url );

$.ajaxSetup({ dataType: "jsonp" });
$.getJSON(new_url, function(json) {
    console.log(json);
});

JSFiddle：http://jsfiddle.net/davemeas/4rt3s7ta/1/（注意：您必须将jQuery添加到该fiddle:）