1、Vue工程的配置
(1)在vue.config.js中的配置(在vue-cli3中默认没有vue.config.js文件):
module.exports = {
devServer:{
proxy:{
'/api':{
target:'http://127.0.0.1/',
changOrigin: true
}
}
},
publicPath: './'
}
(2)在main.js中配置:
axios.defaults.baseURL="/api"
(3)在axios中使用
发起“/book”请求,则会自动代理为“http://127.0.0.1/api/book”
axios.get('/book').then((res) => {
alert(JSON.stringify(res.data))
}).catch((err) => {
console.log(err, 'error');
});
2、Nginx中的配置nginx.conf文件
# 配置Vue静态代码
location / {
root D:/config_web/dist;
index index.html index.htm;
}
# 配置Spring boot代理服务器
location /api/ {
# 设置代理服务器
proxy_pass http://localhost:8080/api/;
proxy_redirect off;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Nginx-Proxy true;
}