Node.js Express应用报无Access-Control-Allow-Origin跨域头错误

• 跨域配置根本未生效：你虽然引入了cors依赖、编写了自定义跨域响应头中间件，但从未在Express实例中注册这两个中间件。从你提供的app.js代码可见，仅执行了const cors = require('cors')，没有调用app.use()加载cors或自定义跨域中间件，所有跨域相关配置都没有实际运行。
• 中间件执行顺序错误：Express中间件严格按照代码注册顺序执行，你将业务路由app.use('/store', usersRoute)写在靠前位置，就算后续补上跨域中间件，路由匹配到请求后会直接返回响应，跨域头根本不会被写入响应报文。
• 跨域配置存在规范冲突：W3C CORS标准明确规定，当Access-Control-Allow-Credentials设为true时，Access-Control-Allow-Origin禁止使用通配符*，必须明确指定允许的前端源地址，否则浏览器会直接拦截响应。
• 未处理OPTIONS预检请求：对于带自定义请求头、非GET/POST简单方法的请求，浏览器会先发送OPTIONS方法的预检请求校验跨域权限，你之前的自定义中间件没有针对OPTIONS请求做快速响应，会直接导致预检失败。
• Postman不受浏览器同源策略约束，不会校验跨域响应头，因此无论后端是否配置跨域，Postman都能正常拿到接口返回，这是工具本身的特性，不能作为跨域配置生效的判断依据。

1. 调整app.js代码，按正确顺序注册cors中间件 #

跨域中间件必须放在所有业务路由、其他解析类中间件的最前面注册，同时修正配置冲突，修改后的完整app.js代码如下：

'use strict';

const express = require('express');
const bodyParser = require('body-parser');
const usersRoute = require('./routers/users-route');
const cors = require('cors');


const app = express();

// 跨域配置放在所有中间件、路由最顶部
// 注意：开启credentials时必须指定具体前端源，替换为你Vue项目实际运行地址，比如本地开发默认是http://localhost:5173
app.use(cors({
  origin: 'http://localhost:5173',
  credentials: true,
  allowedHeaders: ['X-Requested-With', 'Content-Type', 'Authorization'],
  methods: ['GET', 'POST', 'OPTIONS', 'PUT', 'PATCH', 'DELETE']
}));

// 全局处理OPTIONS预检请求
app.options('*', cors());

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));

app.use('/store', usersRoute);

// 托管前端静态资源
app.use(express.static('public'));

module.exports = app;

2. 匹配前后端凭证配置 #

如果你的前端请求（比如axios）没有开启withCredentials: true，也不需要跨域传递Cookie、Session等凭证，可以直接使用简化配置，不需要指定具体源：

// 无跨域凭证需求的简化配置
app.use(cors({
  origin: '*'
}))

注意事项 #

• 不要同时使用cors依赖包和手写的跨域响应头中间件，二选一即可，重复设置响应头会触发Multiple Access-Control-Allow-Origin报错。
• 修改配置后必须重启Node服务才会生效。
• 验证配置是否生效可直接打开浏览器开发者工具-网络面板，查看接口响应头中是否存在正确的Access-Control-Allow-Origin字段即可。

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