说明:
proxyTable是vue-cli脚手架在开发模式下,为我们提供的一个跨域的代理中转服务器服务。它是基于http-proxy-middleware插件的。
配置:
找到config文件下的index.js中的 proxyTable ,添加:
proxyTable: {
'/api': {
target: 'http://192.168.8.143:8082/api', // 接口地址
changeOrigin: true, //是否跨域
pathRewrite: {
'^/api': '/' //需要rewrite的,
}
}
}
// secure: true, // 如果是https接口,需要配置这个参数
// ws: true, // 如果要代理 websockets, 需要配置这个参数
添加好之后,重启项目即可。
进阶:
需要代理的接口较多时,为了方便管理。我们可以在config文件下创建一个proxyConfig.js(代理接口全写这里面),添加:
module.exports = {
proxy: {
'/api': {
target: 'http://192.168.8.143:8082/api', // 代理接口
changeOrigin: true, //是否跨域
pathRewrite: {
'^/api': '/' //需要rewrite的,
}
}
}
}
然后在index.js中添加:
var proxyConfig = require('./proxyConfig')
并将proxyTable改为
proxyTable: proxyConfig.proxy,
重启项目即可。