CORS，无“访问控制允许来源”

Question

我想启用从服务器到外部数据的访问。 我有这个错误：

No 'Access-Control-Allow-Origin' header is present on the requested resource

我已经看到了很多有关此问题的答案，主要是禁用Chrome保护功能的不安全解决方案，但我想保持这些参数处于激活状态。 但是，如果仅用于资源，那很好。

因此，我发现了这一点 ，并且我认为“为单个路线启用CORS”部分可以满足我的需求。

但是我不知道在我的项目中应该在哪里编写这样的代码。 它不能位于index.html中，因为它位于每次重新写入的文件夹“ dist”中。 因此，当我启动项目时，我在dist中编写的内容将被删除。 我需要制作一个新文件吗？ 新路线？ 你是怎样做的 ？

Answer 1

Access-Control-Allow-Origin响应头指示响应是否可以与具有给定来源的资源共享。

---

要允许任何资源访问您的资源，可以指定：

Access-Control-Allow-Origin: *

---

要允许https://developer.mozilla.org访问您的资源，您可以指定：

Access-Control-Allow-Origin: https://developer.mozilla.org

---

这是您可能正在寻找的PHP代码：

 header("Access-Control-Allow-Origin: *");

---

您可以在此页面上找到有关Access-Control-Allow-Origin更多信息： https : //developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin

Answer 2

您可以使用cors软件包轻松设置这些配置。 一个简单的配置允许所有来源：

var cors = require('cors')
var app = express()

app.use(cors())

您可以只允许特定来源访问服务器：

var cors = require('cors')
var app = express()

var whitelist = ['http://example1.com', 'http://example2.com']
var corsOptions = {
  origin: function (origin, callback) {
    if (whitelist.indexOf(origin) !== -1) {
      callback(null, true)
    } else {
      callback(new Error('Not allowed by CORS'))
    }
  }
}

app.get('/products/:id', cors(corsOptions), function (req, res, next) {
  res.json({msg: 'This is CORS-enabled for a whitelisted domain.'})
})

Answer 3

无需为此使用软件包，只需像这样设置中间件

app.use((req, res, next) => {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

如前所述，要限制对特定域的访问，请将*更改为https://whateveryourdomainis.com 。 如果您想允许访问多个域，请按照@guijob概述的方法进行操作