最近有点## 标题闲,就想把自己之前看的东西用一个项目来整理一下 结果就遇到了这个问题
使用webpack搭建简单的vue项目 nodeJs + express + sequelize 实现简单的请求其他服务服务商接口和操作数据库,本来一切都好好的接口请求的时候没有携带cookie
进入正题:
如果本地使用proxy能带cookie,部署到线上不能带,那就是后端问题,让他们在header里配置一下
res.header(“Access-Control-Allow-Origin”,'你部署的地址'
); //当不同源跨域携带cookie 就要使用你部署的地址替换*,
先看看使用axios在什么情况下会自动附带cookie,什么时候不会
在请求同源域名也就是请求不跨域时会自动带上cookie,其他情况下就不会自动带上cookie
先看看代码
// axios
mport axios from 'axios'
const service = axios.create({
baseURL: 'http://127.0.0.1:3000',
withCredentials: true,
timeout: 20000 // 请求超时时间
})
// app.js
app.all('*', (req,res,next) => {
res.header("Access-Control-Allow-Origin", 'http://127.0.0.1:8089'); // 当不同源跨域携带cookie 就要使用req.headers.origin替换*
res.header(
'Access-Control-Allow-Headers',
'Content-Type,Content-Length, Authorization, Accept,X-Requested-With'
);
res.header('Access-Control-Allow-Methods', 'PUT,POST,GET,DELETE,OPTIONS');
res.header('Access-Control-Allow-Credentials', 'true');
res.header('X-Powered-By', ' 3.2.1');
if (req.method === 'OPTIONS') res.send(200);
/*让options请求快速返回*/ else next();
})
结果没有cookie
在Microsoft Edge上可携带cookie,但是google你在不进行浏览器设置的情况下是不会允许携带cookie的(用户不会自己去设置 所以这个不行)
围绕withCredentials去设置我试过很多方法 都不行 如果有正确操麻烦告知下
最后放弃挣扎使用proxy代理
proxyTable: {
'/api': {
target: 'https://t-meeting.wicongress.org.cn',
changeOrigin: true , //是否跨域
pathRewrite: {
'^/api': 'http://127.0.0.1:3000' //需要rewrite重写的,
}
}
},