在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中配置跨域代理方法
基础教程推荐
猜你喜欢
- php-来自mysql的html中的特殊字符输出 2023-10-27
- html+ajax实现上传大文件功能 2023-02-14
- css3实现图片遮罩效果鼠标hover以后出现文字 2024-01-20
- Ajax实现无闪烁定时刷新页面实例代码 2022-12-28
- 浅谈Vue2和Vue3的数据响应 2023-10-08
- Vue中如何把hash模式改为history模式 2024-03-20
- 向fckeditor编辑器插入指定代码的方法 2023-12-02
- CSS3实现双圆角Tab菜单 2024-03-30
- js constructor的实际作用分析 2023-11-30
- js 通用javascript函数库整理 2024-04-23