在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中配置跨域代理方法


猜你喜欢
- 解决浏览器记住ajax请求并能前进和后退问题 2023-02-14
- php mysql字符集:存储国际内容的html 2023-10-26
- 使用React.forwardRef传递泛型参数 2023-07-09
- 详解vue-cli脚手架build目录中的dev-server.js配置文件 2024-03-09
- Ajax实现动态加载数据 2023-02-01
- vue cli3 + ts 打包之后,不显示页面 2023-10-08
- 原生js实现页面滚动动画 2023-12-02
- 使用display:none时隐藏DOM元素无法获取实际宽高的解决方法 2022-11-20
- vue-cli · Failed to download repo vuejs-templates/webpack: connect ECONNREF 2023-10-08
- JS如何通过FileReader获取.txt文件内容 2023-08-08