黑人的命也是命。
支持平等正义倡议.

cors

NPM Version NPM Downloads Build Status Test Coverage

CORS 是一个 node.js 包,用于提供一个 Connect/Express 中间件,可用于启用 CORS,并提供各种选项。

在 Twitter 上关注我 (@troygoode)!

安装

这是一个通过 npm 注册表 可用的 Node.js 模块。安装使用 npm install 命令

$ npm install cors

用法

简单用法(启用所有 CORS 请求)

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

app.use(cors())

app.get('/products/:id', function (req, res, next) {
  res.json({msg: 'This is CORS-enabled for all origins!'})
})

app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

为单个路由启用 CORS

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

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

app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

配置 CORS

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

var corsOptions = {
  origin: 'http://example.com',
  optionsSuccessStatus: 200 // some legacy browsers (IE11, various SmartTVs) choke on 204
}

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

app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

使用动态来源配置 CORS

此模块支持使用提供给 origin 选项的函数动态验证来源。此函数将传递一个字符串,该字符串是来源(如果请求没有来源,则为 undefined),以及一个具有签名 callback(error, origin)callback

回调的 origin 参数可以是中间件 origin 选项允许的任何值,除了函数。有关所有可能值类型的更多信息,请参阅 配置选项 部分。

此函数旨在允许从后端数据源(如数据库)动态加载允许的来源。

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

var corsOptions = {
  origin: function (origin, callback) {
    // db.loadOrigins is an example call to load
    // a list of origins from a backing database
    db.loadOrigins(function (error, origins) {
      callback(error, origins)
    })
  }
}

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

app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

启用 CORS 预检

某些 CORS 请求被认为是“复杂”的,需要一个初始的 OPTIONS 请求(称为“预检请求”)。“复杂” CORS 请求的一个例子是使用除 GET/HEAD/POST 之外的 HTTP 动词(如 DELETE)或使用自定义标头的请求。要启用预检,您必须为要支持的路由添加一个新的 OPTIONS 处理程序。

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

app.options('/products/:id', cors()) // enable pre-flight request for DELETE request
app.del('/products/:id', cors(), function (req, res, next) {
  res.json({msg: 'This is CORS-enabled for all origins!'})
})

app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

您也可以像这样全局启用预检

app.options('*', cors()) // include before other routes

注意:当将此中间件用作应用程序级中间件(例如,app.use(cors()))时,所有路由的预检请求都已处理。

异步配置 CORS

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

var allowlist = ['http://example1.com', 'http://example2.com']
var corsOptionsDelegate = function (req, callback) {
  var corsOptions;
  if (allowlist.indexOf(req.header('Origin')) !== -1) {
    corsOptions = { origin: true } // reflect (enable) the requested origin in the CORS response
  } else {
    corsOptions = { origin: false } // disable CORS for this request
  }
  callback(null, corsOptions) // callback expects two parameters: error and options
}

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

app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

配置选项

  • origin:配置 Access-Control-Allow-Origin CORS 标头。可能的值
    • Boolean - 将 origin 设置为 true 以反映 请求来源,如 req.header('Origin') 所定义,或将其设置为 false 以禁用 CORS。
    • String - 将 origin 设置为特定来源。例如,如果您将其设置为 "http://example.com",则只允许来自“http://example.com”的请求。
    • RegExp - 将 origin 设置为将用于测试请求来源的正则表达式模式。如果匹配,将反映请求来源。例如,模式 /example\.com$/ 将反映来自以“example.com”结尾的来源的任何请求。
    • Array - 将 origin 设置为有效来源的数组。每个来源可以是 StringRegExp。例如,["http://example1.com", /\.example2\.com$/] 将接受来自“http://example1.com”或“example2.com”的子域的任何请求。
    • Function - 将 origin 设置为实现某些自定义逻辑的函数。该函数将请求来源作为第一个参数,并将回调(作为 callback(err, origin) 调用,其中 originorigin 选项的非函数值)作为第二个参数。
  • methods:配置 Access-Control-Allow-Methods CORS 标头。需要逗号分隔的字符串(例如:‘GET,PUT,POST’)或数组(例如:['GET', 'PUT', 'POST'])。
  • allowedHeaders: 配置 **Access-Control-Allow-Headers** CORS 标头。需要一个逗号分隔的字符串(例如:‘Content-Type,Authorization’)或一个数组(例如:['Content-Type', 'Authorization'])。如果未指定,则默认反映请求的 **Access-Control-Request-Headers** 标头中指定的标头。
  • exposedHeaders: 配置 **Access-Control-Expose-Headers** CORS 标头。需要一个逗号分隔的字符串(例如:‘Content-Range,X-Content-Range’)或一个数组(例如:['Content-Range', 'X-Content-Range'])。如果未指定,则不会公开任何自定义标头。
  • credentials: 配置 **Access-Control-Allow-Credentials** CORS 标头。设置为 true 以传递标头,否则将省略。
  • maxAge: 配置 **Access-Control-Max-Age** CORS 标头。设置为整数以传递标头,否则将省略。
  • preflightContinue: 将 CORS 预检响应传递给下一个处理程序。
  • optionsSuccessStatus: 提供一个状态代码,用于成功处理 OPTIONS 请求,因为某些旧浏览器(IE11、各种智能电视)无法处理 204

默认配置等效于

{
  "origin": "*",
  "methods": "GET,HEAD,PUT,PATCH,POST,DELETE",
  "preflightContinue": false,
  "optionsSuccessStatus": 204
}

有关每个 CORS 标头影响的详细信息,请阅读 篇关于 web.dev 的文章。

演示

使用 React 演示 CORS 工作(以及不工作)的演示,请访问:https://node-cors-client.netlify.com

该演示的代码可以在此处找到

许可证

MIT 许可证

作者

Troy Goode ([email protected])