vue-cli构建脚手架并配置代理解决跨域问题
注:只针对开发环境
项目脚手架由vue-cli构建,
1、修改config/dev.env.js,添加:VUE_APP_BASE_API
module.exports = merge(prodEnv, {
NODE_ENV: '"development"',
VUE_APP_BASE_API : '"/api"'
}) 2、修改config/index.js,修改proxyTable属性
proxyTable: {
'/api': { //类似nginx的location配置
target: 'http://127.0.0.1:8087', //需要代理到的api服务地址
changeOrigin: true, //是否跨域
pathRewrite: {
'^/api': '/' //默认在转发时会给api接口带上'/api',如果api服务器,没有'/api'前缀,设置为''或者'/';如果有前缀,则可以去掉
}
}
}3、创建axios对象时的配置:
const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API,
timeout: 5000 // request timeout
})