配置跨域
vue.config.js
module.exports = {
// 配置跨域
devServer: {
proxy: {
'/api': {
// 接口路径
target: 'http://localhost:5050/',
// 是否跨域
changeOrigin: true,
ws: true,
pathRewrite: {
'^/api': '' //路径重写
}
}
}
}
}
获取数据
<script>
export default {
name: "Login",
data() {
return {
userInfo: {
name: "zwj",
email: "2236541780@qq.com",
role: "user",
password: "123456",
},
};
},
methods: {
getData() {
this.$axios
.post("/api/user/register", this.userInfo)
.then((res) => {
console.log(res);
})
.catch((error) => {
console.log(error);
});
},
},
created() {
this.getData();
},
};
</script>


本文介绍如何在Vue项目中使用vue.config.js文件配置跨域代理,通过示例展示了如何设置代理目标、开启跨域并进行路径重写。同时,通过axios发起POST请求获取数据的方式进行了实战演示。
1191

被折叠的 条评论
为什么被折叠?



