前端接口请求nginx反向代理

需求说明

项目用vue-cli3打包后，部署在nginx上，希望在生产中，请求后端接口时，加上前缀xxx。

配个 .env.production 文件, 在使用 axios 发请求时需要 给 baseUrl配上此前缀，此处略去。

BASE_API=./xxx   

nginx 配置

listen       80;
        server_name  localhost;
        location / {
            root   html;
            index  index.html index.htm;
        }
        location /xxx{
            proxy_pass http://11.11.11.11:8089$request_uri;
        }

结果

在访问后端接口时，从控制台network看到的是如下一，这样别人就无法看到真实接口地址了。

// network 上显示的
http://127.0.0.1/xxx/pc/auth/login
// 实际访问地址
http://11.11.11.11:8089/xxx/pc/auth/login