以下是vue-cli 2 中 config/index.js文件中的代码
module.exports = { dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { '/ggg':{ //以 /ggg 开头的URL就会走代理 target: 'http://127.0.0.1:3000', //一定注意这里不管是IP,还是localhost 都要加上 http:// changeOrigin: true, //开启代理,跨域 pathRewrite: { '^/ggg': '' // 什么?,后端请求的URL中没有 /ggg, 那我们把他删了,重写为空字符串 } } },
pathRewrite 这个词刚学的时候 不太好理解 比如 我本地起的项目是 http://localhost:8080 需要请求 http://localhost:3000的接口 举例 1.如果不加这个字段 当访问 /ggg/api/list的时候 就会请求 http://localhost:3000/ggg/api/list 的内容 2.如果加了字段 pathRewrite:{ '^/ggg':''} 就会访问 http://localhost:3000/api/list 的内容 (/ggg 变成了空) 3.如果加了字段 pathRewrite:{ '^/ggg':'/get'} 就会访问 http://localhost:3000/get/api/list 的内容
我本地写的请求
浏览器发送的请求如下图,响应数据就不写了
如果需要mock数据 点击这个 git-mock (koa2写的)可供参考使用