Stackexchange REST API 已被 CORS 策略阻止

Question

我需要使用 Whosebug API 从站点检索一些数据。实际上，当我第一次尝试使用 API 时，由于 CORS 政策，我得到了一个例外。

Access to fetch at 'https://whosebug.com/users/myID/reputation' from origin 'http://localhost:3000' 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.

我了解我的请求被阻止的原因是 header 不在响应中。但是，StackExchange API 不会附加在响应 header Access-Control-Allow-Origin 中吗？我在调用请求的方式上做错了什么？

Answer 1

does not StackExchange API attach in the response header Access-Control-Allow-Origin? I'm doing something wrong in how I'm invoking the request?

Stack Exchange API 允许 client-side 请求，但您请求的页面不是 Stack Exchange API - 它只是一个普通的 Stack Exchange 页面，而不是 API 端点专为此类事情而设计，因此它没有所需的 header.

如果您想正确使用 API，请阅读文档 here 并选择您需要的端点。对于使用我的用户 ID 的示例，可以使用以下代码：

fetch('https://api.stackexchange.com/2.2/users/9515207/reputation?site=Whosebug')
  .then(res => res.json())
  .then(console.log);

api.stackexchange.com 具有适当的 headers：access-control-allow-origin: *，允许 client-side 脚本请求它。

since this request is for a trial project, can I implement a proxy using a free-tier of some platform? I see a lot of suggestions for Heroku but I'm not very familiar with that platform

对于未设置所需 header 的服务器的更一般情况，如果您想使用他们的响应之一 client-side，您将不得不退回请求中继服务器。你可以在 Heroku 上制作你自己的应用程序（一个很好的免费选项），或者使用像 https://cors-anywhere.herokuapp.com/

这样的东西

Stackexchange REST API 已被 CORS 策略阻止

Stackexchange REST API has been blocked by CORS policy

endpoint

cors

reactjs

stackexchange-api

react-native