主要功能

1. 负载均衡
2. 反向代理
3. 动静分离
4. 配置https

一、负载均衡

负载均衡是一门计算机网络技术，主要用来优化资源使用、最大化吞吐率、最小化响应时间、同时避免过载的目的。
如果一个网站只有一台服务器的话，如果这台服务器宕机了，那么整个网站将无法正常访问。当访问网站人数过多，并发量达到一定规模，超过服务器性能的极限，整个网站也将无法访问。而负载均衡就是用来解决这一类的问题。

负载均衡是通过后端引入一个负载均衡器和至少一个额外的web服务器来缓解这类问题(增加的web服务器和原本的web服务器提供相同的内容)。用户访问的时候，先访问到负载均衡器，再通过负载均衡器将请求转发给后台服务器。 通过这种方法，当有一台服务器宕机时，负载均衡器就分配其他的服务器给用户，极大的增加的网站的稳定性。

负载均衡器主要可以转发http、https、tcp、udp四种请求规则
负载均衡器如何给用户分配服务器？ 负载均衡器有多种负载均衡算法，基本就是给每台服务器一个不同的权重，通过权重来给用户分配服务器。
负载均衡不需要前端进行配置，主要是服务端进行配置，前端稍作了解即可。

1.1 负载均衡的几种常用方式

• 轮询（默认）

// nginx.config
upstream backserver {
    server 192.168.0.1;
    server 192.168.0.2;
}

• 权重weight

// nginx.config
upstream backserver {
    server 192.168.0.1 weight=2;
    server 192.168.0.2 weight=8;
}

• 响应时间来分配

// nginx.config
upstream backserver {
    server 192.168.0.1;
    server 192.168.0.2;
    fair;
}

server {
    listen 80;
    server_name localhost; 
    location / {
      proxy_pass  http://backserver;
    }
}

1.2 健康检查

如果检测出其中某台服务器异常,那么在通过客户端请求nginx反向代理进来的都不会被发送到该服务器上（直至下次轮训健康检查正常）

基本例子如下?

upstream backserver{
    server 192.168.0.1  max_fails=1 fail_timeout=40s;
    server 192.168.0.2  max_fails=1 fail_timeout=40s;
}

server {
    listen 80;
    server_name localhost; 
    location / {
      proxy_pass http://backend;
    }
}

涉及两个配置：

• fail_timeout : 设定服务器被认为不可用的时间段以及统计失败尝试次数的时间段，默认为10s
• max_fails : 设定Nginx与服务器通信的尝试失败的次数，默认为：1次

二、反向代理

反向代理是前端经常会用到的一项功能，主要是为了解决浏览器跨域访问的问题。当协议、域名、端口号有一项或多项不同时，便违反了同源策略，需要跨域。前端跨域用的较多的有：

2.1 jsonp跨域：

使用html的script标签可以引入第三方的js文件，所以我们可以通过

<script src="http://后台接口"></script>

来绕过跨域的限制。但是需要注意的是，jsonp只支持get请求。

2.2 webpack反向代理：

前端开发中，基于webpack配置环境的spa页面已经是一种趋势，webpack内置的proxy可以帮助我们在开发环境调试接口时将我们的地址代理到后台服务地址，解决跨域问题。配置如下

        proxyTable: {
            '/api': {
                target: 'http://192.168.xxx.xxx:8080',
                changeOrigin: true
            }
        } 

这段代码的含义就是，当前端访问接口匹配到'/api'时，将代理到'192.168.xxx.xxx:8080'服务端地址，如果前台的接口名为/api/restful，代理的请求路径将是'192.168.xxx.xxx:8080/api/restful'。

2.3 使用nginx进行反向代理

前端开发完成，对代码进行打包后，webpack就无法使用了。这个时候我们手里只有html、css、js等静态文件，后台接口地址都会访问不到。这个时候nginx就登场了，nginx反向代理配置和webpack大同小异，匹配到动态的地址时将请求转发到一个服务器地址实现跨域。

2.3.1 为什么需要反向代理

反向代理的优势主要有以下两点

• 防火墙作用

当你的应用不想直接暴露给客户端（也就是客户端无法直接通过请求访问真正的服务器，只能通过Nginx），通过nginx过滤掉没有权限或者非法的请求，来保障内部服务器的安全

• 负载均衡

也就上一章提到负载均衡，本质上负载均衡就是反向代理的一种应用场景，可以通过nginx将接收到的客户端请求"均匀地"分配到这个集群中所有的服务器上(具体看负载均衡方式),从而实现服务器压力的负载均衡

2.3.2 如何使用反向代理

具体流程如下：

1) 访问nginx官网，下载nginx到本地

2) 将打包完成的代码放置在nginx的html目录下

3) 打开conf文件夹下的nginx.conf文件，配置如下：

server {
    listen       3000;    //监听的本地端口
    server_name  localhost;    
                
    location /api {         //匹配到/api开头的接口时，转发到下面的服务器地址
        root   html;  
        proxy_pass  http://192.168.xxx.xxx:8080;    //服务器地址      
    }  
                        
    location =/ {
        root html;
        index  index.htm  index.html;   //默认主页
    }
                        
    # 所有静态请求都由nginx处理，存放目录为html  
    location ~ .(htm|html|js|css|jpg|png|gif|eot|svg|ttf|woff|woff2)$ {  
        root    html;      //配置静态资源地址
    }    
                
    error_page   500 502 503 504  /50x.html;
        location = /50x.html {
        root   html;
    }
}

在 Nginx 反向代理是，会通过 location 功能匹配指定的 URI，然后把接收到的符合匹配 URI的请求通过 proxy_pass 转移给之前定义好的 upstream 节点池

三、配置https

微信小程序现在越来越火，大批前端开发进军微信小程序，但是微信小程序只支持https请求，这是一个问题。

Nginx 常用来配置Https认证，主要有两个步骤：签署第三方可信任的 SSL 证书 和 配置 HTTPS。

配置https具体流程：

1) 申请证书：

配置 HTTPS 要用到私钥 example.key 文件和 example.crt 证书文件，而申请证书文件的时候要用到 example.csr 文件。对于想了解更多关于SSL证书的点这里 SSL证书介绍

2) 申请完成后下载nginx版本的证书至本地，一个crt文件一个key文件，crt为证书，key为密钥

3) Nginx配置https

server {
    listen       443 ssl;    //监听443端口，因为443端口是https的默认端口。
                               80为http的默认端口
    server_name  www.domain.com;    //配置域名
    #证书文件    
    ssl_certificate      证书的绝对路径;
    #私钥文件
    ssl_certificate_key  密钥的绝对路径;
                
    # location / {        //反向代理的服务器地址，视情况进行配置
    #    proxy_pass   http://112.35.xxx.xxx;
    # }          
}   

总结整个过程

1.用户输入http://域名，默认80端口

2.nginx监听到80端口被访问，匹配到域名为www.dream.com，将服务代理到http://192.168.3.10:8080

3.服务器返回页面资源

4.用户输入https://二级域名,默认端口为443

5.nginx监听443端口,匹配到相应域名，进行证书验证，将服务代理到指定服务器

四、其他常用配置

4.1 IP白名单

可以配置nginx的白名单，规定有哪些ip可以访问你的服务器，防爬虫必备

• 简单配置

 server {
        location / {
                deny  192.168.0.1; // 禁止该ip访问
                deny  all; // 禁止所有
            }
  }
复制代码

• 白名单配置

建立白名单

vim /etc/nginx/white_ip.conf
 ...
192.168.0.1 1; 
 ...
复制代码

修改nginx配置(nginx.conf)

geo $remote_addr $ip_whitelist{
    default 0;
    include ip.conf;
}
// geo 指令主要是可以根据指定变量的值映射出一个新变量。 如果不指定变量，默认为$remote_addr
复制代码

为匹配项做白名单设置

server {
    location / {
        if ( $ip_whitelist = 0 ){
            return 403; //不在白名单返回 403
        }
        index index.html;
        root /tmp;
    }
}

4.2 适配PC与移动环境

当用户从移动端打开PC端baidu.com的场景时，将自动跳转指移动端m.baidu.com，本质上是Nginx可以通过内置变量$http_user_agent，获取到请求客户端的userAgent，从而知道当前用户当前终端是移动端还是PC，进而重定向到H5站还是PC站

server {
 location / {
        //移动、pc设备agent获取
        if ($http_user_agent ~* '(Android|webOS|iPhone)') {
            set $mobile_request '1';
        }
        if ($mobile_request = '1') {
            rewrite ^.+ http://m.baidu.com;
        }
    } 
}

4.3 配置gzip

开启Nginx gzip，压缩后,静态资源的大小会大大的减少,从而可以节约大量的带宽,提高传输效率,带来更好的响应和体验

server{
    gzip on; //启动
    gzip_buffers 32 4K;
    gzip_comp_level 6; //压缩级别，1-10，数字越大压缩的越好
    gzip_min_length 100; //不压缩临界值，大于100的才压缩，一般不用改
    gzip_types application/javascript text/css text/xml;
    gzip_disable "MSIE [1-6]\."; // IE6对Gzip不友好，对Gzip
    gzip_vary on;
}

4.4 Nginx配置跨域请求

当出现403跨域错误的时候，还有 No 'Access-Control-Allow-Origin' header is present on the requested resource报错等，需要给Nginx服务器配置响应的header参数：

location / {  
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
    add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';

    if ($request_method = 'OPTIONS') {
        return 204;
    }
} 

五、如何使用Nginx

通过在本地使用Nginx，从启动、更改、重启等环节来介绍Nginx的基本使用

• 如何启动 sudo nginx

• 修改nginx.conf 配置 (具体看你配置位置) vim /usr/local/etc/nginx/nginx.conf

• 检查语法是否正常 sudo nginx -t

• 重启nginx sudo nginx -s reload

• 创建软链接(便于管理多应用nginx)

假如我们在程序文件夹下有一个 ngxin 配置文件：/home/app/app.nginx.conf 我们需要给这个文件创建一个软链接到 /etc/nginx/conf.d/ 下：
ln -s /home/app/app.example.com.nginx.conf /etc/nginx/conf.d/app.nginx.conf
这样操作之后，当我们改应用配置文件，/etc/nginx/conf.d/ 下与之对应的配置文件也会被修改，修改后重启 nginx 就能够使新的 ngxin 配置生效了。