Spring boot和Vue前后端完全分离配置

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; }