前端 vue axios跨域导致ResponseHeaders中set-cookie失效解决方案

后端配置基本网上都有可以自己查查，下面主要讲讲vue前端如何set-cookie起作用 跨域配置

devServer: {
  proxy: {
    '/abc/': { // 代理url关键字
      target: 'https://abc.com', // 目标地址,
      ws: true, // 是否代理websockets
      changeOrigin: true, // 是否跨域
      pathRewrite: {
        '^/abc': '' // 根据自身需求重写路径
      },
      headers: {
        'User-Agent': '******', //  根据自身需求添加
      },
      cookieDomainRewrite: {  // 重写domain
        '***.com': '***', //重写地址是你自身host(可以打印 window.location.host 查看)
        'old.domain': 'new.domain'
      },
      cookiePathRewrite: { // 重写path
        '/****.com/': '/abc',
        'old.path': 'new.path'
      }
    }
  }
}

 以上是对应 vue.config.js 文件中本地开发的设置 

配置好之后就能看到对应域名下cookie已经可以写入

参考官方文档 

[github.com/chimurai/ht… vue.config.js 文件中本地开发的设置 参考官方文档 github.com/chimurai/ht…)

再下来说说 nginx 的配置文件写法

location /abc/ { // 代理url关键字
  proxy_pass https://abc.com/abc/; // 目标地址,
  proxy_cookie_domain old.domain $host; // 重写domain
  proxy_cookie_path old.path new.path;  // 重写path
  proxy_set_header User-Agent "***"; //  根据自身需求添加
}