没有“ Access-Control-Allow-Origin”客户端修复

Question

我试图通过suredbits从API获取免费的NFL数据。不幸的是，他们没有在标头中添加Access-Control-Allow-Origin，这会导致CORS问题。当我尝试运行这样的代码时...

$.getJSON("http://api.suredbits.com/nfl/v0/stats/jones/julio", function(playerData) {
      alert(playerdata); 
}

我不断收到这个错误 No 'Access-Control-Allow-Origin' header is present on the requested resource.

因此，基本上，他们有什么办法可以通过客户端解决错误？

Answer 1

实际上，有一种方法可以从客户端进行修复：将请求网址更改为https://cors-anywhere.herokuapp.com/http://api.suredbits.com/nfl/v0/stats/jones/julio：

const proxyURL = "https://cors-anywhere.herokuapp.com/";
const requestURL = "http://api.suredbits.com/nfl/v0/stats/jones/julio";
$.getJSON(proxyURL + requestURL, function(playerData) {
  console.log(playerData);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

是的，这并不能完全从客户端进行修复，因为它的实际作用是导致请求通过https://cors-anywhere.herokuapp.com/发出，这是一个开放的CORS代理，仅添加Access-Control-Allow-Origin响应标头，以便浏览器将允许您的前端JavaScript代码访问响应。

但是，正如答案中的代码片段所示，它绝对不需要对托管要从中获取数据的API终结点的服务器进行任何更改。相反，所有这些都需要对您自己的前端代码进行小改动。

当然，在所有情况下依靠这样的公共开放代理并不是正确的解决方案。但是，至少在API提供程序尚未启用CORS启用其API以便您可以直接向其发送请求并获得可以使用的响应的情况下，这是一个很好的解决方案。

在尝试获取数据时，请求的资源上出现了 “ 如何使用CORS代理来解决“无访问权限允许的标头”问题的答案部分“无访问权限允许的标头”问题来自REST API的更多细节。