在 React js 中点击 fetch api 时，Get 方法被转换为 OPTIONS答案

【问题标题】：Get method is converted to OPTIONS when hitting fetch api in React js在 React js 中点击 fetch api 时，Get 方法被转换为 OPTIONS
【发布时间】：2018-05-07 20:14:00
【问题描述】：

我正在尝试访问以下 api 并需要基本的身份验证用户名和密码，并且在此允许的方法只是 get

dispatch(requestBegin());
let apiPath = `xxxx/TEST/appservice/api/app/10/10000127201901`;
return fetch(apiPath, {
  method: 'get',
  headers : {
     "contentType":"application/x-www-form-urlencoded",
      "Authorization" : 'Basic '+btoa('xxx:xxx'),
    },
})
  .then((response) => {
    dispatch(getEventsEnds(json));
  })
  .catch((error) => {
    dispatch(getEventsEnds());
  });

控制台登录的错误：

对预检请求的响应未通过访问控制检查：否请求中存在“Access-Control-Allow-Origin”标头资源。因此不允许使用原点“http://localhost:2200” 使用权。响应的 HTTP 状态代码为 405。如果响应不透明满足您的需求，将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。

选项http://xxx/appservice/api/app/10/10000127201901 405（方法不允许）

当我尝试点击get api时，任何人都可以解释一下为什么它显示选项

【问题讨论】：

您在一个端口 2200 上为您的应用程序提供服务，而您的 API 很可能在另一个端口上。
@HenrikAndersson 那么解决方案是什么？

标签： reactjs

【解决方案1】：

这意味着您的 API 服务器不接受 CORS 请求或来自本地主机的请求。

查看您的 API 文档，但我猜您将无法从您的网络应用直接与其交互。

最好的办法是使用代理，您可以自己开发一个或使用 node-http-proxy 之类的东西来代理您的 API 调用。（有 php 或 python 等价物）

代理服务器将能够发出请求，然后将它们转发到您的应用程序。

建议进一步阅读：在谷歌上输入理解 CORS 并阅读更多相关信息。

对于本地开发，请查看：

https://github.com/Rob--W/cors-anywhere

【讨论】：

反应端的任何解决方案？我们可以使用这种 api 吗？如果没有，那么 api 端的解决方案是什么？我们有什么例子吗？
请花时间阅读CORS，如果你想做前端开发，这是基础知识。从前端您无能为力（React 与否）。如果您需要在开发期间使用 API，请在本地机器上使用代理（添加了链接）。当需要部署到生产环境时，请确保您的域已被您的 API 列入白名单

【解决方案2】：

当客户端 api URL 和服务器 URL 不匹配时会出现此问题，包括端口号。在这种情况下，您需要为跨源资源共享的 CORS 启用服务。

使用 npm install cors

参考这个[refer][1]

【讨论】：