用nginx实现前后端分离的项目的前后端访问

现在几乎都是前后端分析的项目，在开发和线上一般都会使用nginx做代理来实现跨域和负债均衡。nginx安装前面已经讲过，现在写写如何配置，前端技术为vue。

server {
      listen 80;
      server_name zq.shidebin.com;

      location / {
        root /var/www/html/yanwei/zq-arbitrate-client;
        index index.html index.htm;
      }
      location /web/ {
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          proxy_set_header Host $host;
          proxy_set_header accept-encodeing 'gzip, deflate';
          proxy_set_header content-type 'application/json';
          proxy_set_header X-Real-IP $remote_addr;
          proxy_set_header authorization $http_authorization;
          proxy_set_header accept '*/*';
          proxy_set_header x-bce-date $http_x_bce_date;
          proxy_connect_timeout 300;
          proxy_send_timeout 300;
          proxy_read_timeout 300;
          proxy_pass http://192.168.2.88:8081/web/;
      }
    }
    server {
        listen 80;
      server_name private.shidebin.com;

      location / {
        root /var/www/html/yanwei/private-arbitrate-client;
        index index.html index.htm;
      }
      location /web/ {
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          proxy_set_header Host $host;
          proxy_set_header accept-encodeing 'gzip, deflate';
          proxy_set_header content-type 'application/json';
          proxy_set_header X-Real-IP $remote_addr;
          proxy_set_header authorization $http_authorization;
          proxy_set_header accept '*/*';
          proxy_set_header x-bce-date $http_x_bce_date;
          proxy_connect_timeout 300;
          proxy_send_timeout 300;
          proxy_read_timeout 300;
          proxy_pass http://192.168.2.88:8080/web/;
      }
}

前端代码在路径/var/www/html/yanwei/private-arbitrate-client中。相当于原本访问nginx欢迎页的想在访问前端页面，然后前端到后端的跳转url被nginx拦截在转发。
加上负载均衡：

upstream private {
     server   192.168.2.88:8080 weight=1 max_fails=2 fail_timeout=30s;
     server   192.168.1.252i3:8280 weight=1 max_fails=2 fail_timeout=30s;
    }
    upstream zq {
     server   192.168.2.88:8081 weight=1 max_fails=2 fail_timeout=30s;
     server   127.0.0.1:8091 weight=1 max_fails=2 fail_timeout=30s;
    }
    #gzip  on;
    server {
      listen 80;
      server_name zq.shidebin.com;

      location / {
        root /var/www/html/yanwei/zq-arbitrate-client;
        index index.html index.htm;
      }
      location /web/ {
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          proxy_set_header Host $host;
          proxy_set_header accept-encodeing 'gzip, deflate';
          proxy_set_header content-type 'application/json';
          proxy_set_header X-Real-IP $remote_addr;
          proxy_set_header authorization $http_authorization;
          proxy_set_header accept '*/*';
          proxy_set_header x-bce-date $http_x_bce_date;
          proxy_connect_timeout 300;
          proxy_send_timeout 300;
          proxy_read_timeout 300;
          proxy_pass http://zq;
      }
    }
    server {
        listen 80;
      server_name private.shidebin.com;

      location / {
        root /var/www/html/yanwei/private-arbitrate-client;
        index index.html index.htm;
      }
      location /web/ {
          proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
          proxy_set_header Host $host;
          proxy_set_header accept-encodeing 'gzip, deflate';
          proxy_set_header content-type 'application/json';
          proxy_set_header X-Real-IP $remote_addr;
          proxy_set_header authorization $http_authorization;
          proxy_set_header accept '*/*';
          proxy_set_header x-bce-date $http_x_bce_date;
          proxy_connect_timeout 300;
          proxy_send_timeout 300;
          proxy_read_timeout 300;
          proxy_pass http://private;
      }

此文章同步到了我个人公众号：java面试工程师。关注公众号更加便于查阅。