«

Vue-cli3.0配置proxy跨域

emer 发布于 2018-11-23 10:16   3787 次阅读     



在根目录新建vue.config.js文件 
module.exports = {
  devServer: {
    proxy: {
      '^/api': {
        target: 'http://localhost:3010',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        },
        onProxyReq (proxyReq, req, res) {
          originHost = req.headers['x-forwarded-for']
          const cookie = req.headers['cookie']
          if (cookie) {
            proxyReq.setHeader('cookie', cookie)
          }
        },
        onProxyRes(proxyRes, req, res) {
           if (proxyRes.headers['set-cookie']) {
           // 域名信息与实际业务相关
             proxyRes.headers['set-cookie'] = proxyRes.headers['set-cookie'].map(v => {
              return v.replace('domain=.mufeng.me', 'domain=' + originHost.split(':')[0])
             })
          } 
        }
      }
    }
  }
}

pathRewrite重写目录,访问的是localhost:8080/api指向的就是localhost:3000/api,不重写情况下访问是localhost:3000/api/api   //根据实际情况该写


然后重启服务,将自动加载配置文件