使用Axios POST请求设置Cookie不生效的问题排查求助

核心原因 #

跨域场景下，你的Axios请求未开启携带凭证配置，同时服务端CORS中间件也未正确配置允许跨域凭证传递，导致浏览器无法保存POST请求返回的Cookie，后续GET请求自然拿不到对应值。

具体问题点及修复 #

1. 客户端Axios配置缺失 #

Axios默认在跨域请求中不会携带/保存Cookie，必须显式开启withCredentials: true配置。

修改客户端代码：

const api = axios.create({
    baseURL: "http://localhost:8888/foo",
    withCredentials: true // 新增：允许跨域携带凭证
});

2. 服务端CORS配置不完整 #

你当前的app.use(cors());是默认配置，未指定允许的客户端源，也未开启凭证支持。跨域场景下，浏览器要求服务端明确指定信任的源，并允许凭证传递。

修改服务端server.js：

// 替换原来的app.use(cors());
app.use(cors({
    origin: "http://localhost:3000", // 指定你的客户端地址
    credentials: true // 允许跨域携带Cookie等凭证
}));

补充说明 #

• 直接HTTP请求（如地址栏、Postman）正常的原因：这类请求不属于浏览器的跨域场景（或工具不遵循浏览器跨域规则），无需满足CORS凭证要求，所以Cookie能正常保存。
• 移至GET路由后Axios调用正常的原因：如果是直接在地址栏访问GET路由，属于同域请求（浏览器地址栏是localhost:8888的话），自然无需跨域配置；如果是Axios的GET请求也正常，大概率是测试场景触发了浏览器特殊处理，但本质上跨域请求仍需上述两项配置才能稳定工作。

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