请求的资源上不存在“Access-Control-Allow-Origin”标头。 起源'http://fiddle.jshell.net'

Question

在 jsfiddle 中执行 JQUERY ajax 调用时获得以下内容

请求的资源上不存在“Access-Control-Allow-Origin”标头。 因此，不允许访问 Origin 'http://fiddle.jshell.net'。 响应具有 HTTP 状态代码 404

当我把它放在浏览器中时 URL 工作正常吗？

在 JsFiddle 中不起作用？

var URL="http://query.yahooapis.com/v1/public/yql&env=http%3A%2F%2Fdatatables.org%2Falltables.env&format=json&q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%20in%20(%22ACM%22)%0A%09%09";
$.get(URL).done(function (data) {
    alert("HELLO");
}).fail(function (jqXHR, textStatus) {
    alert("NOPE");
}).always(function () {
    alert("OH WELLL");
});

Answer 1

我在 JSFiddle 和 Codepen 上都遇到了同样的问题。 我需要加载一个外部 js-data 文件，但由于浏览器安全性而被阻止。 我的解决方法是将整个 js-data 作为带有 HTML 的脚本包含在标题中：

<script src="http://yoururlto/yourdata.js"></script> 

数据js本身看起来像这样：

var data = {
    "type": "FeatureCollection",
    "features": [{
                }]
};

然后以您想要的任何方式访问数据：

geojsonLayer.addData(data);
map.fitBounds(geojsonLayer.getBounds());

Answer 2

这是从浏览器发出 XHR 调用时的标准 CORS 响应。 服务器需要允许浏览器的域/位置发出请求。

res.header('Access-Control-Allow-Origin', '*');

否则，服务器将阻止传入的请求。

解决此问题的另一种方法是使用已知服务器作为代理向外部 API 发出请求。

Answer 3

这是因为您的 API 没有返回CORS标头。 此标头可以限制允许访问该特定页面的主机，并且此行为嵌入在 jQuery 使用的 XMLHttpRequest 函数中。 它被用作安全措施，因此没有真正的解决方法。