react-redux 桌面应用程序中请求的资源错误中不存在 Access-Control-Allow-Origin' 标头

Posted 2023-02-22

【中文标题】react-redux 桌面应用程序中请求的资源错误中不存在 Access-Control-Allow-Origin\' 标头

【英文标题】：No Access-Control-Allow-Origin' header is present on the requested resource error in react-redux desktop applicationreact-redux 桌面应用程序中请求的资源错误中不存在 Access-Control-Allow-Origin' 标头

【发布时间】：2019-07-13 23:12:34

【问题描述】：

我正在从 API 获取数据，但它不起作用。它给了我" Access to fetch at 'http://muslimsalat.com/lahore/false/5.json?key=API_KEY' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: 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. "

之类的错误

当我在 react-native 移动设备中获取数据时，它可以工作，但是当我在 react 桌面中获取数据时，它无法正常工作。

谁能告诉我这个错误的原因是什么，我该如何解决？

【问题讨论】：

如果您拥有该服务器，您可以在 muslimsalat.com 上启用 CORS。否则，不幸的是，您无能为力。如果您使用快递，请查看github.com/expressjs/cors。

不是一个 api 链接的错误，所有 api 链接在 react 桌面都不起作用，但在 react-native 移动应用程序中起作用

@ZainShabir 这是因为 CORS 保护是您只能在 Web 环境中使用的东西。这是一种浏览器保护。

Why does my javascript get a "No 'Access-Control-Allow-Origin' header is present on the requested resource" error when Postman does not?的可能重复

不知道怎么解决，我用的是react-redux桌面，但是你给我的链接，react兄里没有

【参考方案1】：

将 CORS 添加到 API URL。您只需将本地 IP 添加到后端服务 (API)。如果您需要适当的代码让我们知道您使用哪种语言作为后端 API。

【讨论】：

我在 react-redux 中使用这个

【参考方案2】：

CORS 是一种机制，在该机制中，域可以指定哪些其他域可以向它发出请求。默认情况下，没有Access-Control-Allow-Origin 标头，这意味着例如***.com 处的脚本无法调用google.com：

fetch('https://www.google.com')
  .then(console.log)
  .catch(console.error)
// Error: Failed to fetch

这就是为什么以脚本运行的 React 应用程序无法获取网络上的大多数内容。

但是，React Native 应用程序作为应用程序运行，而不是作为脚本运行，因此它不受 CORS 的影响。

【讨论】：

5 个月前，我能够在 react-redux 桌面中获取 api 数据，但现在我无法获取此错误的原因

因为他们更改了 CORS 标头