axios请求默认是不携带 Cookie 的,如果需要携带 Cookie 前端需要配置

// 允许携带cookie请求
axios.defaults.withCredentials = true

// 创建axios实例
const service = axios.create({
	baseURL: process.env.BASE_API, // api的base_url
	timeout: 5000, // 请求超时时间
	withCredentials: true
})

同时还要确保后端配置了

 Access-Control-Allow-origin= '前端请求IP地址(如果有端口带上端口)' // 不能为 * 否则跨域不生效
 Access-Control-Allow-Credentials = true

如果还是不行,后端设置 Cookie 时,需要设置 SameSite=None;Secure,同时后端配置 https 请求,因为浏览器默认 SameSite=Lax
在这里插入图片描述
在这里插入图片描述
补充:如果使用了 Mock.js 会携带不上 Cookie
如果使用了mock.js,只需要在使用mock的地方设置以下代码,就可以在正常发送 cookie 了

import Mock from 'mockjs'
Mock.XHR.prototype.withCredentials = true

如果以上都配置好了,还是不能携带 Cookie 就是浏览器的问题了。但一般情况都是后端配置跨域,和浏览器无关,因为换个浏览器就不知道情况了
在这里插入图片描述
把框选的设置为 Disabled 就可以了
更新:新版 Chrome 浏览器已经没有这个选项了

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐