面试题：Node.js中如何在模块化的API接口服务里处理跨域请求

Question

在使用Node.js构建模块化的API接口服务时，经常会遇到跨域问题。请描述至少两种在Node.js项目里处理跨域请求的方法，并举例说明如何在Express框架中配置以允许特定源的跨域请求。

Answer 1

处理跨域请求的方法

1. CORS（跨源资源共享）：
   • 原理：通过在服务器端设置响应头，告诉浏览器哪些源可以访问该资源。
   • 优点：是一种官方推荐的处理跨域的方式，简单且通用。
   • 缺点：需要服务器端支持并正确配置。
2. 代理服务器：
   • 原理：在客户端和目标服务器之间搭建一个代理服务器，客户端向代理服务器发送请求，代理服务器再将请求转发给目标服务器，并将响应返回给客户端。这样，由于请求是从同一域发起的，就不存在跨域问题。
   • 优点：可以解决复杂的跨域场景，如不同端口、不同协议等。
   • 缺点：增加了服务器架构的复杂度，需要额外维护代理服务器。

在Express框架中配置允许特定源的跨域请求（使用CORS）

1. 安装cors包：

npm install cors

2. 在Express应用中使用：

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

// 允许特定源的跨域请求
const whitelist = ['http://example.com', 'https://example.com'];
const corsOptions = {
  origin: function (origin, callback) {
    if (whitelist.indexOf(origin)!== -1 ||!origin) {
      callback(null, true);
    } else {
      callback(new Error('Not allowed by CORS'));
    }
  }
};

app.use(cors(corsOptions));

// 其他路由和中间件配置
app.get('/', (req, res) => {
  res.send('Hello World!');
});

const port = 3000;
app.listen(port, () => {
  console.log(`Server running on port ${port}`);
});

在Express框架中配置允许特定源的跨域请求（使用代理服务器 - 以http-proxy-middleware为例）

1. 安装http-proxy-middleware包：

npm install http-proxy-middleware

2. 在Express应用中使用：

const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');
const app = express();

// 配置代理
app.use('/api', createProxyMiddleware({
  target: 'http://target-server.com', // 目标服务器地址
  changeOrigin: true,
  pathRewrite: {
    '^/api': '' // 重写路径，去掉/api前缀
  }
}));

// 其他路由和中间件配置
app.get('/', (req, res) => {
  res.send('Hello World!');
});

const port = 3000;
app.listen(port, () => {
  console.log(`Server running on port ${port}`);
});