我如何解决 React js 上的 CORS 策略问题

Question

来自来源 'http://localhost:3003' 已被 CORS 策略阻止：对飞行前请求的响应未通过访问控制检查：'Access-Control-Allow-Origin' header 包含多个值“*、*” , 但只允许一个。让服务器发送具有有效值的 header，或者，如果不透明的响应满足您的需要，请将请求的模式设置为 'no-cors' 以在禁用 CORS 的情况下获取资源。

当我 post 请求使用其他域服务时，我是如何解决问题的！！

Answer 1

我在 Google Chrome 中安装了 cors unblock 扩展，对我来说没有更多问题了。

Answer 2

对于开发，您可以使用 localhost:3003 的代理。将此行写在反应项目的 package.json 中。 "proxy": "http://localhost:3003".

要解决这个问题，你必须在后端做，例如，如果你的后端是在nodejs中，那么你可以使用CORS包。

安装 cors 包。

npm i cors

然后在你的 nodejs 文件中写下这个

var cors = require('cors');
app.use(cors())

配置cors可以参考documentation

Answer 3

在您的 node.js 后端添加：

app.use(cors({origin: true, credentials: true}));

您也可以尝试安装 this chrome 扩展。它为我解决了问题

Answer 4

Whosebug 上还有这个 post 我相信它会有所帮助

我如何解决 React js 上的 CORS 策略问题

how can i solve the problem CORS policy on react js

reactjs