在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项目调用通用组件_vue封装公共组件(通用组件)需要考虑到什么 2023-10-08
- ajax实现省市三级联动效果 2023-02-22
- 对未知高度的图片设置垂直居中的方法详解 2024-02-05
- 利用Blob进行文件上传的完整步骤 2023-12-19
- JQuery+Ajax+Struts2+Hibernate框架整合实现完整的登录注册 2022-10-17
- vue中面包屑的封装 2023-10-08
- JSP和Struts解决用户退出问题 2024-01-07
- mui上拉加载功能实例详解 2024-02-09
- 使用prerender-spa-plugin实现vue预渲染 2023-10-08
- JavaScrpt中如何使用 cookie 设置查看与删除功能 2024-01-29