NestJS 8.0.6三种CORS配置均不生效，响应无Access-Control-Allow-Origin头

问题原因排查 #

• Referrer Policy: strict-origin-when-cross-origin配置不会对CORS产生影响，该规则仅控制浏览器发送Referer请求头的策略，和服务端是否返回Access-Control-Allow-Origin响应头无关。
• 你当前配置失效的核心原因有两个：
  1. 配置执行顺序错误：CORS相关配置需要放在所有业务逻辑注册、服务启动操作之前，你将app.use、app.enableCors放在了startAllMicroservices之后，不会作用于已注册的路由/网关请求
  2. 你报错的请求路径为/socket.io/开头，属于WebSocket网关的请求，NestJS普通HTTP服务的CORS配置不会作用于WebSocket相关请求，需要单独为网关配置CORS规则

修复步骤 #

第一步：修正main.ts配置顺序 #

删除重复冗余的CORS配置，调整执行顺序：

import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import { microserviceConfig} from "./msKafkaConfig";

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  // 先配置全局HTTP CORS规则
  app.enableCors({
    origin: "*",
    methods: "GET,PUT,POST,DELETE,PATCH,OPTIONS,UPGRADE,CONNECT,TRACE",
    allowedHeaders: "Content-Type, Accept"
  });

  app.connectMicroservice(microserviceConfig);
  await app.startAllMicroservices();
  
  await app.listen(3000);
}
bootstrap();

第二步：为WebSocket网关添加CORS配置 #

找到你项目中添加了@WebSocketGateway()装饰器的网关类，在装饰器参数中添加CORS配置：

import { WebSocketGateway } from '@nestjs/platform-socket.io';
// 若使用原生WS则替换为 import { WebSocketGateway } from '@nestjs/platform-ws';

@WebSocketGateway({
  cors: {
    origin: "*"
  }
})
export class YourCustomGateway {
  // 原有网关逻辑
}

配置完成后重启服务，/socket.io路径的请求就会正常返回Access-Control-Allow-Origin响应头。

内容的提问来源于stack exchange，提问作者feder