springboot + vue项目本地化部署配置内+外网

1、项目使用nginx做访问代理

配置如下：

# 内网访问配置

server {
        listen       80;
        server_name  192.168.0.235;
    client_max_body_size 100M;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   /home/jack/mes/static/dist;
            index  index.html index.htm;
        }

        location /websocket {# 后端websocket服务映射
            proxy_set_header Host $host;
            proxy_redirect off;
            proxy_pass http://192.168.0.235:8081/websocket;   
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
        }

        location /proxyApi/ {
            proxy_pass   http://192.168.0.235:8081/;
        }

        location /upload {
            alias   /home/jack/upload;
            autoindex on;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
 }

# 外网访问配置

 server {
        listen       9001;
        server_name  58.210.184.228;
    client_max_body_size 100M;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   /home/jack/mes/static/dist;
            index  index.html index.htm;
        }

        location /websocket {# 后端websocket服务映射
            proxy_set_header Host $host;
            proxy_redirect off;
            proxy_pass http://192.168.0.235:8081/websocket;   
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
        }

        location /proxyApi/ {
            proxy_pass   http://192.168.0.235:8081/;
        }

        location /upload {
            alias   /home/jack/upload;
            autoindex on;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
 }

2、vue打包npm run build 后的index.html进行IP对口配置

<script>window.SITE_CONFIG{apiURL:window.location.origin+"/proxyApi",socketURL:"ws://"+window.location.host+"/websocket"}

备注：

传参前边的URL：window.location.origin（可用来动态获取接口）
"http://192.168.0.1:10080"

域名 + 端口：window.location.host
"192.168.0.1:10080"