为何React用Axios发POST请求到Express无法获取Cookie，GET却可以？

1. Axios POST 请求的传参结构错误 #

Axios 不同HTTP方法的参数签名存在固定差异：

• GET 请求参数结构为 Axios.get(url, config)，第二个参数直接是请求配置项
• POST 请求参数结构为 Axios.post(url, data, config)，第二个参数是请求携带的序列化表单/JSON数据，第三个参数才是请求配置项

当前代码把携带withCredentials: true的配置对象直接作为第二个参数传入，本质是把配置当成了普通请求体发送，这个配置根本没被Axios解析生效，浏览器自然不会在POST请求中自动附带对应Cookie。
这也是为什么把请求改成GET就能正常读到Cookie：测试GET时withCredentials被放到了第二个参数的正确配置位置，配置生效触发了浏览器的Cookie携带逻辑。

2. 跨域场景下的Cookie携带规则未满足 #

就算配置位置修正，跨域场景下浏览器对POST请求携带Cookie有强制校验规则，只要有一项不满足，Cookie就会被浏览器拦截，不会随请求发送到后端：

• 响应头不能将Access-Control-Allow-Origin设置为通配符*
• 响应头必须显式设置Access-Control-Allow-Credentials: true
• Cookie本身的属性设置必须符合浏览器的跨域携带要求

1. 修正Axios POST的传参位置 #

将请求配置挪到POST方法的第三个参数位，第二个参数传入空对象作为请求体占位，正确示例代码：

Axios.post('http://localhost:3003/test', {}, {
  withCredentials: true
})
  .then((response) => {
    console.log(response.data);
  })
  .catch((error) => {
    console.log(error);
  });

2. 修正Express后端的CORS配置 #

确保跨域规则完全匹配带Cookie的要求：

• 禁止使用通配符作为允许的源地址，必须明确填写前端实际运行的地址（比如http://localhost:5173、http://localhost:8080这类和前端实际端口完全匹配的地址）
• 显式开启凭证允许配置，以官方cors中间件为例的配置代码：

const cors = require('cors')
app.use(cors({
  origin: 'http://localhost:你的前端实际运行端口',
  credentials: true
}))

3. 排查Cookie本身的属性配置 #

• 本地HTTP开发环境下，不要给Cookie设置SameSite=None，该属性要求必须搭配HTTPS场景下的Secure属性才能生效，本地环境下设置会直接导致Cookie被拦截
• 确认Cookie的Domain属性和当前请求的域名匹配，避免因为域名不匹配导致Cookie被浏览器过滤

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