axios请求不携带cookie 在配置文件里添加withCredentials: true也没有用的分析(google)

最近有点## 标题闲,就想把自己之前看的东西用一个项目来整理一下 结果就遇到了这个问题

使用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重写的,
     }
    }
 },

猜你喜欢

转载自blog.csdn.net/weixin_44441196/article/details/115398563#comments_26634166
今日推荐