我试图在使用Express.js web框架的Node.js应用程序中支持CORS。我已经阅读了谷歌关于如何处理这个问题的小组讨论,并阅读了一些关于CORS如何工作的文章。首先,我这样做(代码是用CoffeeScript语法写的):

app.options "*", (req, res) ->
  res.header 'Access-Control-Allow-Origin', '*'
  res.header 'Access-Control-Allow-Credentials', true
  # try: 'POST, GET, PUT, DELETE, OPTIONS'
  res.header 'Access-Control-Allow-Methods', 'GET, OPTIONS'
  # try: 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept'
  res.header 'Access-Control-Allow-Headers', 'Content-Type'
  # ...

这似乎不管用。似乎我的浏览器(Chrome)没有发送最初的选项请求。当我刚刚更新了块的资源,我需要提交一个跨起源GET请求:

app.get "/somethingelse", (req, res) ->
  # ...
  res.header 'Access-Control-Allow-Origin', '*'
  res.header 'Access-Control-Allow-Credentials', true
  res.header 'Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS'
  res.header 'Access-Control-Allow-Headers', 'Content-Type'
  # ...

它工作(在Chrome)。这也适用于Safari。

我听说……

在实现CORS的浏览器中,每个跨源GET或POST请求之前都有一个OPTIONS请求,用于检查GET或POST是否正常。

所以我的主要问题是,为什么这种情况在我身上没有发生?为什么我的app。options块没有被调用?为什么我需要在我的主app.get块设置标题?


当前回答

do

npm install cors --save

只需要在主文件中添加这些行就可以了(把它们放在任何路由之前)。

const cors = require('cors');
const express = require('express');
let app = express();
app.use(cors());
app.options('*', cors());

其他回答

为了回答您的主要问题,CORS规范只要求在POST或GET中有任何非简单内容或标头时将OPTIONS调用放在POST或GET之前。

需要CORS飞行前请求(OPTIONS调用)的内容类型是任何内容类型,除了以下内容:

应用程序/ x-www-form-urlencoded 多部分/格式 文本/平原

除了上面列出的内容类型外,任何其他内容类型都将触发飞行前请求。

对于header,除了以下以外的任何Request header都会触发一个pre-flight Request:

接受 接收语言 内容语言 内容类型 DPR 保存数据 Viewport-Width 宽度

任何其他请求头将触发预飞行请求。

因此,您可以添加一个自定义报头,如:x-Trigger: CORS,它应该触发飞行前请求并点击OPTIONS块。

参见MDN Web API参考- CORS预飞请求

最简单的方法是在项目中使用以下方法安装cors模块:

npm i --save cors

然后在你的服务器文件中使用以下方法导入它:

import cors from 'cors';

然后简单地像这样使用它作为中间件:

app.use(cors());

希望这能有所帮助!

如果你想让它特定于控制器,你可以使用:

res.setHeader("X-Frame-Options", "ALLOWALL");
res.setHeader("Access-Control-Allow-Origin", "*");
res.setHeader("Access-Control-Allow-Methods", "POST, GET");
res.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");

请注意,这也将允许iframes。

以下是我的工作,希望它能帮助到别人!

const express = require('express');
const cors = require('cors');
let app = express();

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

从https://expressjs.com/en/resources/middleware/cors.html#configuring-cors获得参考

保持相同的路由思想。我使用这个代码:

app.all('/*', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
});

类似于http://enable-cors.org/server_expressjs.html的例子