跨域设置

在现代 Web 开发中，跨域请求（CORS，Cross-Origin Resource Sharing）是一个常见的问题。当浏览器从一个域名向另一个域名发起请求时，可能会遇到跨域问题。为了解决这个问题，CORS 提供了一种机制来允许跨域访问资源。本文将介绍如何在 Koa 中配置跨域设置，解决跨域问题。

1. 什么是 CORS？

CORS（跨域资源共享）是一种浏览器安全功能，它通过允许浏览器访问来自不同源的资源来实现跨域请求。在默认情况下，浏览器会阻止网页发起跨域请求，但服务器可以通过设置相应的 HTTP 头来允许某些跨域请求。

2. 在 Koa 中配置 CORS

在 Koa 中，配置 CORS 最简单的方法是使用 koa2-cors 中间件。koa2-cors 是一个用于处理 CORS 请求的中间件，支持多种配置选项。

安装 koa2-cors

npm install koa2-cors

基本配置

安装完中间件后，可以在 Koa 应用中使用它来处理跨域请求。

const Koa = require('koa');
const cors = require('koa2-cors');
const app = new Koa();

app.use(cors({
  origin: '*',  // 允许所有域名的跨域请求
  allowMethods: ['GET', 'POST', 'PUT', 'DELETE'],  // 允许的请求方法
  allowHeaders: ['Content-Type', 'Authorization'],  // 允许的请求头
}));

app.use(ctx => {
  ctx.body = 'Hello, world!';
});

app.listen(3000);

在此例中，origin: '*' 表示允许所有域名的跨域请求。allowMethods 和 allowHeaders 配置了允许的请求方法和请求头。

3. 更细粒度的 CORS 配置

在实际开发中，我们通常需要更细粒度的控制。可以根据不同的来源域、请求方法或头部设置不同的 CORS 策略。

只允许特定域名访问

app.use(cors({
  origin: (ctx) => {
    if (ctx.request.header.origin === 'https://example.com') {
      return 'https://example.com';  // 只允许 example.com 访问
    }
    return '*';  // 其他域名不允许跨域
  },
}));

允许特定请求方法

app.use(cors({
  allowMethods: ['GET', 'POST'],  // 只允许 GET 和 POST 请求
}));

4. CORS 预检请求

当浏览器发送跨域请求时，特别是使用了自定义请求头（如 Authorization）或请求方法（如 PUT）时，浏览器会先发送一个 OPTIONS 请求，这个请求称为“预检请求”。如果服务器响应了正确的 CORS 头，浏览器才会继续发送实际的请求。

koa2-cors 会自动处理 OPTIONS 请求，不需要手动配置。

5. 使用 CORS 防止恶意请求

在实际应用中，有时候我们需要防止某些恶意请求。可以通过限制 CORS 的来源域来增强安全性。

示例：限制来源域

app.use(cors({
  origin: (ctx) => {
    const allowedOrigins = ['https://trusted.com', 'https://another-trusted.com'];
    if (allowedOrigins.includes(ctx.request.header.origin)) {
      return ctx.request.header.origin;
    }
    return 'https://default.com';  // 对不允许的域名返回默认值
  },
}));

6. CORS 与 Session、Cookie

如果跨域请求中涉及到 Cookies 或 Session，需要在 CORS 配置中添加 credentials 选项。

app.use(cors({
  origin: 'https://example.com',  // 允许的域
  credentials: true,  // 允许发送 Cookie
}));

这样，浏览器在发送请求时会携带 Cookie，从而实现跨域的 Session 保持。

7. 总结

在 Koa 中，配置 CORS 是一个简单且灵活的过程。通过使用 koa2-cors 中间件，能够轻松设置跨域访问控制，确保前端和后端能够正常通信，同时避免恶意请求的干扰。通过对 CORS 配置的细粒度控制，能够实现更加安全的跨域策略，满足各种业务需求。