nginx 上部署vue，同时转发多台服务器，实现负载均衡

部署vue项目可以利用tomcat服务器，也可以用户nginx部署。

如果利用nginx部署vue项目，则在linux上不需要配置node.js环境，启动nginx就可以，注意：跨域处理

一、 先有你的前端人员进行vue打包，会生成dist 文件

二、下载nginx

  nginx配置文件进行修改

以下是我的配置文件内容：

upstream tomcatserver {
server 172.18.74.112:80 ;
server 47.92.215.252:8080 ;
}   
  server {
    listen 80;
    server_name 域名;
    access_log /data/wwwlogs/access_nginx.log combined;
    root /data/wwwroot/default;
    index index.html index.htm index.jsp;
    #error_page 404 /404.html;
    #error_page 502 /502.html;
    location /nginx_status {
      stub_status on;
      access_log off;
      allow 127.0.0.1;
      deny all;
    }
    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|flv|mp4|ico)$ {
      expires 30d;
      access_log off;
    }
     location ~ .(jsp|jspx|do)?$ {
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_pass http://127.0.0.1:8080;
    }
    location ~ .*\.(js|css)?$ {
      expires 7d;
      access_log off;
    }
   # location ~ {
    #  proxy_pass http://tomcatserver;
     # include proxy.conf;
  #  }
    location ~ ^/(\.user.ini|\.ht|\.git|\.svn|\.project|LICENSE|README.md) {
      deny all;
    }
  }
  server {
    listen 80;
    server_name 域名
    access_log /data/wwwlogs/access_nginx.log combined;
    root /data/wwwroot/dist/;#vue打包后的上传服务器上的路径的dist
    index index.html index.htm index.jsp;
   try_files $uri $uri/ /index.html;#解决nginx刷新出现404  当请求文件的路径找不到是，自动转发到vue的首页
    location /nginx_status {
      stub_status on;
      access_log off;
      allow 127.0.0.1;
      deny all;
    }
    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|flv|mp4|ico)$ {
      expires 30d;
      access_log off;
    }
    location ~ .*\.(js|css)?$ {
      expires 7d;
      access_log off;
    }
 location /api/ {#用于vue访问后台api,匹配Url中带有api的，并转发到 ttp://tomcatserver/api
        proxy_pass http://tomcatserver;#这一段是用来设置转发地址的，意思就是你要把/api 这个路径指向的地址，直接代理本地端口
        proxy_cookie_path / /api;#作用是用来改变cookie的路径
        proxy_redirect default;
        rewrite ^/api/(.*) /$1 break;  #这一段是用来进行匹配修改的，意思是去除掉后面的api
        client_max_body_size  500m;

    }
    }
    location ~ ^/(\.user.ini|\.ht|\.git|\.svn|\.project|LICENSE|README.md) {
      deny all;
    }
  }

 

这样配置就可以了，同时也不影响移动端请求api