背景:
在我们使用Vue直接请求后端时,通常会报跨域问题,如下图:
要解决这个问题,方案有很多种,最简单的莫过于vue-cli的devServer配置。
devServer配置
在vue项目下创建vue.config.js文件,如下图:
在vue.config.js中写入devServer配置,例如:
module.exports = {
devServer: {
proxy: {
"/api": {
target: "http://localhost:8081/",
pathRewrite: {
"^/api": "",
},
},
},
},
};
调用时,比如axios.get("/api/xxx");会被自动代理到http://localhost:8081/xxx上