使用带有 JS 的 Riot 游戏 API 并且无法加载响应数据

Question

我尝试使用 Riot 游戏 API，下面的代码返回了“状态代码：200”，看起来没问题，但我遇到了如下两个错误。

Access to fetch at 'https://oc1.api.riotgames.com/lol/summoner/v4/summoners/by-name/edisona?api_key=RGAPI-xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

GET https://oc1.api.riotgames.com/lol/summoner/v4/summoners/by-name/edisona?api_key=RGAPI-xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx net::ERR_FAILED

所以我添加了 { mode: 'no-cors' } 并且错误消失了，但是之后控制台中没有返回任何数据我只是直接使用 URL 并且浏览器显示了正确的数据。我不知道为什么会这样，如果你能帮助我，我将不胜感激。

const name = 'edisona';
const api_key = 'RGAPI-xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx';
const url =
  'https://oc1.api.riotgames.com/lol/summoner/v4/summoners/by-name/' +
  name +
  '?api_key=' +
  api_key;
fetch(url)
.then(function(response) {
  console.log(response); 
}).catch(function(error) {  
  console.log('Request failed', error)  
});

Answer 1

这似乎是一个 Cross-Orgin 请求错误（您没有将 CORS headers 添加到代理请求）。

尝试使用 CORS-Anywhere，一个 NodeJS 反向代理来做到这一点。

这是一个demo. Try reading some about CORS: https://fetch.spec.whatwg.org/#cors-protocol-and-credentials

使用带有 JS 的 Riot 游戏 API 并且无法加载响应数据

using Riot games API with JS and fail to load response data

javascript

riot-games-api