如何解决Node.js跨域问题：example.com访问sub.example.com的CORS报错

核心问题分析 #

报错显示请求https://sub.example.com/app/listen/1.wav时未返回Access-Control-Allow-Origin头，尽管你配置了CORS中间件，但大概率是中间件加载顺序错误，导致静态文件请求未经过CORS处理。

修复步骤 #

1. 调整中间件加载顺序（关键）

确保cors中间件在express.static（或其他托管静态文件的中间件）之前加载，这样所有请求（包括静态资源请求）都会经过CORS处理。示例代码：

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

// 先挂载CORS中间件，确保所有请求都经过它
app.use(cors({
  origin: true, // 等价于你之前的回调写法，允许所有请求源
  credentials: true
}));

// 再挂载静态文件中间件，假设音频文件存放在项目的public/app/listen目录下
app.use('/app/listen', express.static('public/app/listen'));

// 其他业务路由...
app.listen(443); // 或你实际使用的端口

2. 验证CORS头是否生效

用curl命令测试目标资源的响应头，确认是否包含CORS相关字段：

curl -I -H "Origin: https://www.example.com" https://sub.example.com/app/listen/1.wav

正常情况下，响应头应该包含Access-Control-Allow-Origin: https://www.example.com（或*，因为你配置的是允许所有源）。

3. 排查反向代理干扰（如果有）

如果服务器使用了Nginx等反向代理，检查代理配置是否覆盖了Node.js返回的CORS头。避免在Nginx配置中手动添加Access-Control-Allow-Origin，防止和Node.js的CORS配置冲突。

额外优化（可选） #

若想更严谨，可明确指定允许的请求源，替代允许所有源的配置：

app.use(cors({
  origin: ['https://example.com', 'https://www.example.com'],
  credentials: true
}));

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