javascript - 没有 'Access-Control-Allow-Origin' 客户端修复

Question

我正在尝试从 API by suredbits 中获取免费的 NFL 数据.不幸的是，在他们的 header 中，他们没有添加 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

实际上有一种方法可以从客户端修复它:通过将请求 URL 更改为 https://cors-anywhere.herokuapp.com/http://api.suredbits.com/nfl/v0/统计/琼斯/胡里奥:

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 响应 header ，以便浏览器允许您的前端 JavaScript 代码访问响应。

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

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

如何使用 CORS 代理解决“没有 Access-Control-Allow-Origin header ”问题的答案部分 No 'Access-Control-Allow-Origin' header is present on the requested resource—when trying to get data from a REST API 有更多详细信息。