在Vue2.0中,可以通过配置webpack的proxyTable来实现跨域代理。下面具体介绍一下Vue2.0中如何配置跨域代理。
安装脚手架
npm install http-proxy-middleware --save-dev
配置proxyTable
//config/index.js
dev: {
// ...
proxyTable: {
'/api': {
target: 'http://127.0.0.1:3000', // 目标服务器地址
changeOrigin: true, // 是否改变请求源
pathRewrite: {
'^/api': '' // 路径重写
}
}
}
},
配置package.json
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev"
},
在Vue文件中使用代理.json
axios.get('/api/login').then(response => {
this.user = response.data
}).catch(error => {
console.log(error)
})
以上是编程学习网小编为您介绍的“如何在vue2.0中配置跨域代理方法”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
编程基础网
本文标题为:如何在vue2.0中配置跨域代理方法
基础教程推荐
猜你喜欢
- Vue中created和mounted使用场景分析 2023-07-09
- el-form清除rules校验 2024-12-07
- CSS伪类/伪元素选择器整理 2024-03-09
- vue-cli 卸载版本及安装指定版本的命令 2023-10-08
- 纯CSS(无JS)实现的二级弹出菜单效果代码 2023-12-20
- CSS中的伪元素简介 2024-03-09
- jQuery动画效果图片轮播特效 2023-12-19
- javascript 按键事件(兼容各浏览器) 2023-12-14
- jquery实现滑动楼梯效果 2024-01-17
- vue导出当前页面为pdf格式 2023-10-08
