您现在的位置是:首页>学习分享
webPack配置proxy解决开发环境跨域问题 2019-02-03 335

 WebPack中devServer的proxy代理其实是集成了http-proxy-middleware

 配置proxy 可以解决本地环境的跨域问题

 在vue.config.js进行如下配置

  module.exports = {
      devServer: {
          proxy: {
              '/api': {
                  target: 'http://test.com',
                  changeOrigin: true,
                  ws: true,
                  pathRewrite: {
                      '^/api/sl': '/api/tl'
                  },
                  secure: false,
              }
          }
      }
  }

 配置说明

  •  '/api': 请求匹配的字符串,如果请求是地址是..../api/test.php会被http://test.com/api/test.php 域名后面可以包含路径
  •  target: 转发的域名或ip,如果target是域名,changeOrigin则需要设置为true
  •  changeOrigin: 默认false,是否需要改变原始主机头为目标URL。设置为true, 本地就会虚拟一个服务器接收你的请求并代你发送该请求。
  •  ws: 是否代理websockets
  •  pathRewrite: 重写请求 如是源访问的地址是/api/sl 会被重写为/api/tl
  •  secure: false,不检查安全问题。 设置后,可以接受运行在 HTTPS 上,可以使用无效证书的后端服务器
 参考 
文章评论
小程序端
  • 微信公众号
  • 我的微信

Copyright © www.zhangqingblog.com All Rights Reserved.

备案号:鄂ICP备18005731号-2