CORS策略阻止了从源“http://localhost:3000”获取数据的访问

提问者：小点点

CORS策略阻止了从源“http://localhost:3000”获取数据的访问

添加到数据库会显示错误。我该怎么办？

CORS策略阻止了从源“http://localhost:3000”在“http:xxx”获取数据的访问:对预飞行请求的响应未通过访问控制检查:请求的资源上不存在“Access-Control-Allow-Origin”标头。如果不透明响应满足您的需要，请将请求的模式设置为“no-cors”，以便在禁用CORS的情况下获取资源。

我的功能:

  addItem = (e) => {
e.preventDefault();
const ob = {
  X: 53.0331258,
  Y: 18.7155611,
}
fetch("http://xxx", {
  method: "post",
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify(ob)
})
  .then(res => res.json())
  .then(res => {
    console.log(res);
  })

}

共2个答案

匿名用户

您的服务器应该以如下所示的响应进行响应

Access-Control-Allow-Origin: https://localhost:3000

在您能够将其配置为解决方案之前，您可以安装下面的chrome扩展来继续您的测试

https://chrome.google.com/webstore/detail/who-cors/hnlimanpjeeomjnpdglldcnpkppmndbp？hl=en-gb

但以上只是继续开发的一个变通方法

我建议您阅读本文以了解CORS https://javascript.info/fetch-crossorigin

匿名用户

对于浏览器，默认情况下CORS是启用的，您需要告诉浏览器可以向不服务于客户端应用程序（静态文件）的服务器发送请求

如果将RestFul API与node和express一起使用，请将此中间件添加到文件中

app.use((req, res, next) => {
  res.header("Access-Control-Allow-Origin": "*")
})