Express js 中允许多个 CORS 域

JS

Express JS 是一个流行的 Node.JS 框架，用于构建可扩展的 Web 应用程序。在 Web 开发中，跨域资源共享（CORS）是一个常见的问题，它限制了浏览器在一个域上执行的跨域请求。然而，有时我们希望允许多个域名进行跨域请求。Express JS 提供了一种简单的方式来实现这一点。

什么是 CORS？

CORS 是一种机制，它使用额外的 HTTP 头部来告诉浏览器是否允许在一个域上执行跨域请求。默认情况下，浏览器会阻止跨域请求，以确保安全性。这意味着，如果我们的前端代码在一个域上运行，但需要从另一个域请求数据，浏览器会拒绝这个请求。这就是为什么我们需要在服务器端设置 CORS。

Express JS 的 CORS 中间件

Express JS 提供了一个 CORS 中间件，可以轻松地处理跨域请求。它可以配置为允许特定域或多个域进行跨域请求。让我们看看如何使用 Express JS 的 CORS 中间件来允许多个域进行跨域请求的案例。

首先，我们需要安装 Express JS 和 cors 模块。通过以下命令在项目目录下安装它们：

npm install express cors

接下来，我们可以创建一个 Express JS 应用程序，并在其中使用 cors 中间件。下面是一个简单的示例代码：

Javascript
const express = require('express');
const cors = require('cors');
const app = express();
// 允许多个域进行跨域请求
const allowedOrigins = ['http://example1.com', 'http://example2.com', 'http://example3.com'];
app.use(cors({
  origin: function (origin, callback) {
    // 检查请求的域是否在允许的域列表中
    if (allowedOrigins.indexOf(origin) !== -1 || !origin) {
      callback(null, true);
    } else {
      callback(new Error('不允许的域'));
    }
  }
}));
// 其他路由和中间件
app.get('/', (req, res) => {
  res.send('Hello World!');
});
// 启动服务器
app.listen(3000, () => {
  console.log('服务器已启动在 http://localhost:3000');
});

在上面的代码中，我们通过调用 cors 中间件来启用 CORS。我们使用 allowedOrigins 数组来指定允许的域列表。如果请求的域在列表中或者没有指定域，则允许请求通过。否则，将返回一个错误。

自定义 CORS 响应头

除了允许多个域进行跨域请求，我们还可以自定义 CORS 响应头。这些头部可以包含附加的安全性和访问控制信息。在 Express JS 中，我们可以通过设置 Access-Control-Allow-* 头部来自定义 CORS 响应头。

Javascript
app.use(cors({
  origin: function (origin, callback) {
    // 检查请求的域是否在允许的域列表中
    if (allowedOrigins.indexOf(origin) !== -1 || !origin) {
      callback(null, true);
    } else {
      callback(new Error('不允许的域'));
    }
  },
  exposedHeaders: ['Content-Length', 'X-Foo', 'X-Bar'],
  credentials: true
}));

在上面的代码中，我们设置了 exposedHeaders 和 credentials 选项。exposedHeaders 数组指定了在浏览器中暴露的自定义响应头。credentials 选项设置为 true，表示允许跨域请求携带凭据，例如 Cookie。

Express JS 的 CORS 中间件提供了一个简单而强大的方式来处理跨域请求。通过配置允许的域列表，我们可以轻松地允许多个域进行跨域请求。此外，我们还可以自定义 CORS 响应头，以增加安全性和访问控制。使用 Express JS 的 CORS 中间件，我们可以构建更灵活的 Web 应用程序，并提供更好的用户体验。