美文网首页
webpack跨域配置proxyTable

webpack跨域配置proxyTable

作者: 追风筝的Hassan | 来源:发表于2020-04-26 14:27 被阅读0次
 '/accountApi': {
        target: '',//目标接口域名
        changeOrigin: true,//是否跨域
        secure: false,
        pathRewrite: {//重写接口
          '^/accountApi': '/'
        },
        onProxyRes: function (proxyRes, req, res) {
          //登录处理
          let cookies = proxyRes.headers['set-cookie']
          var newCookies = []
          if (cookies) {
            cookies.forEach(cookie => {
              // 连接到 local dev qa 执行下面代码
              newCookies.push(
                cookie.replace(/目标域名/, 'localhost')
              )
              //连接到 uat prod 执行下面代码
              // newCookies.push(
              //   cookie
              //     .replace(/目标域名/, 'localhost')
              //     .replace(/Secure; HttpOnly/, '')
              // )
            })
            proxyRes.headers['set-cookie'] = newCookies
          } else {
            console.log('登录失败=========')
          }
        }
      },

dev-server的proxy有两个事件“onProxyReq”,“onProxyRes”,onProxyReq:可以在请求发送前对请求内容进行更改
onProxyRes:可以在请求响应后对请求内容进行更改
项目中遇到跨域问题,再不设置CORS跨域的情况下,开发使用代理解决跨域问题。
1.先获取验证码,直接加载url的方式获得,返回值中带cookie
2.登录请求,是异步请求axios,需带上cookie
问题:
1.跨域采用代理方式,用proxyTable
2.登录请求头里加入cookie, axios设置withCredentials: true
3.cookie作用范围,需配置代理服务器。

参考文章:https://www.cnblogs.com/strinkbug/p/6073806.html

相关文章

网友评论

      本文标题:webpack跨域配置proxyTable

      本文链接:https://www.haomeiwen.com/subject/exwdwhtx.html