Question

我有一个询问API的人，特别想使用NBA API（stats.nba.com）创建一个示例。诚然，我不是专家，但是我想我可以使用fetch来举例说明。

我在API端点（link）上找到了一些文档，并且可以构成一个URI，当直接从地址栏访问该URI时，它可以解析为JSON数据。

我遇到的问题是，当我尝试使用访存API时，似乎不允许使用CORS，因此我做了一些阅读，据我了解，我应该能够使用'no-cors '。但是，当我使用“ no-cors”参数时，出现了CORB（跨源阻止）错误，找不到太多文档，但是如果名称是一个指示，则我认为无法提出跨源请求。

使该假设令人困惑的部分是，尽管我似乎无法使用NBA API客户端找到任何示例，但我可以看到许多库似乎使用了与我使用Python测试过的端点相同的端点。和其他服务器端方法。实际上，上面的文档来自执行该操作的git。

作为替代方案，我确实尝试了使用NHL API（statsapi.web.nhl.com）的另一个示例，它似乎运行良好，并且可以生成团队名册列表。

以下是演示该问题的简化代码。 'dataURL1'与'cors'可以很好地工作，但是dataURL2对于'cors'和'no-cors'都给出错误。

function test01() {            
  var dataURL1 = "http://statsapi.web.nhl.com/api/v1/teams/8";
  var dataURL2 = "https://stats.nba.com/stats/commonteamroster/?Season=2017-18&TeamID=1610612737";                                 
  
  /*
  - if dataURL1 is used there is no issue with 'cors' parameter
  - if dataURL2 is used with 'cors' parameter, 
    a no 'Access-Control-Allow-Origin' message is given
  - if dataURL2 is used with 'no-cors' parameter, 
    a CORB message is given
  */      
  fetch(dataURL2, { mode: 'no-cors' })
    .then((resp) => resp.json())
    .then(function (data) {
      console.log("data retrieved");                    
    })
    .catch(function (error) {
      console.log(error);
    });
}

大多数情况下，我需要确认我没有丢失任何东西，并且不能通过客户端发出请求。如果是这种情况，我希望能找到一篇文章或内容的一些指导，以解释为什么可以在服务器端而不是客户端发出请求。

Answer 1

NHL URL之所以起作用，是因为其服务器以Access-Control-Allow-Origin: *（加上其他CORS标头）响应，而NBA服务器则没有。由于您不控制有问题的服务器，因此无法更改此行为。您可以让您执行控制的服务器执行提取，并让您的服务器在浏览器发送请求时以CORS友好的方式响应内容。

同源策略是一种机制，浏览器可通过该机制阻止脚本从请求脚本中读取存在于不同来源的资源。如果您使用非浏览器软件执行HTTP请求，则CORS将不适用，因为CORS是Web浏览器固有的安全措施。

no-cors是一种表达方式，“是的，我知道这是一种跨源资源。无论如何都要获取它，但当然不要让我阅读响应。 ”这是一种“不透明的响应”，当可以将内容直接呈现给用户（例如，放置在<img>标签中的跨域图像）而又使尝试尝试的脚本无法访问内容时可以使用了解其内容。

但是，JSON数据不是这种不透明响应功能有意义的数据。当浏览器决定CORB时，“没有办法使此响应对请求的页面有用；我担心这样做纯粹是为了利用安全漏洞。因此，我什至不会（例如）解析此JSON。 “

Answer 2

如果您查看从http://statsapi.web.nhl.com/api/v1/teams/8返回的标头，则会看到Access-Control-Allow-Origin

此标头允许来自nhl.com之外的其他域的浏览器向api发出请求。

如果您查看https://stats.nba.com/stats/commonteamroster/?Season=2017-18&TeamID=1610612737中的标头，则不会看到Access-Control-Allow-Origin标头。

未将nba.com服务设置为从浏览器称为跨域。

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#Access-Control-Allow-Origin

stats.nba.com的CORS / CORB

2 个答案: