前端须要了解的nginx

简述

Nginx是一款轻量级的http服务器,采用事件驱动的异步非阻塞处理方式,具备较好的IO性能,时经常使用于服务端的反向代理和负载失衡

nginx优点

• IO多路复用: 多个描述的IO操做能够在一个线程里并发交替顺利完成,复用线程
• CPU亲和: 一种CPU核心和Nginx工做进程绑定方式,把每一个worker进程固定在一个cpu核上执行
• sendfile: 零拷贝传输模式 不须要通过用户空间

nginx做用

gzip压缩

gzip on;  # 开启gzip压缩 默认仅支持html文件
gzip_http_version 1.1; # 压缩版本
gzip_min_length 1k;  # 启用gzip压缩的最小文件，小于设置值的文件将不会压缩
gzip_comp_level 2; # 压缩级别，1-9，数字越大压缩的越好，也越占用CPU时间
gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;  # 进行压缩的文件类型
gzip_disable "MSIE [1-6]\."; # 禁用IE 6 gzip
复制代码

能够在请求头中的Accept-Encoding来查看是都开启gzip压缩。

适配pc环境与移动环境

用于实现根据用户的浏览环境自动切换站点。Nginx能够经过内置变量$http_user_agent识别出用户是pc端仍是移动端，进而控制重定向到H5站仍是PC站。 配置以下：

location / {
    if ($http_user_agent ~* '(Android|webOS|iPhone|iPod)') {
        set $mobile_request '1';
    }
    if ($mobile_request = '1') {
        rewrite ^.+ http://mysite-base-H5.com; # 重定向
    }
}
复制代码

代理和跨域

在server1.com向server2.com发起请求时,能够配置代理,或者经过设置请求头解决跨域.配置以下:

server {
    listen 80; # 监听端口
    server_name  http://server1.com; ## 当前服务器名称
    location / {
        proxy_pass http://server2.com; # 进行服务器代理,也可依次实现跨域
        add_header Access-Control-Allow-Origin *; # 设置请求头实现跨域
    }
}
复制代码

负载均衡

nginx负载均衡策略:

• 轮询(默认):每一个请求按照时间顺序逐一分配到不一样的后端服务器,若是服务器down掉,能够自动剔除

upstream balanceServer {
    server  10.1.22.33:12345;
    server  10.1.22.34:12345;
}
复制代码

• ip_hash:给每一个访问ip指定hash,根据hash固定访问某个服务器,由此能够解决session不能跨域的问题

upstream balanceServer {
    ip_hash;
    server 10.1.22.33:12345;
    server 10.1.22.34:12345;
}
复制代码

• weight:加权轮询,weight和访问比率成正比,用于后端服务器性能不均

upstream balanceServer {
    server  10.1.22.33:12345 weight=2;
    server  10.1.22.34:12345 weight=1;
}
复制代码

• least_conn:最小链接数 哪一个链接少就分配给谁

upstream balanceServer {
    least_conn;
    server 10.1.22.33:12345;
    server 10.1.22.34:12345;
}
复制代码

图片文件防盗链

校验refer实现,配置以下:

location ~ .\.(jpg|png)$ {
    valid_referers none blocked http://39.107.64.34; # 默认协议和指定域名能够打开
    if ($invalid_referer) { # 无权限访问时 返回403
        return 403;
        #rewrite ^/ http://XXXX/403.gif; # 这个图片不能被防盗链，否则显示不正常。除非把上面的GIF过滤删除。
    }
}
复制代码

对于源为none(源为空 )、blocked(不为空，可是里面的值被代理或者防火墙删除)、指定源如http://39.107.64.34,则内置变量$invalid_referer为0,能够访问该站点图片.不然为1,不能访问,进行查看403页面 提示: 若是用户直接在浏览器输入你的图片地址,那么图片显示正常，由于它符合none这个规则

其余

• 进行移动端调试
• 对页面文件访问权限的处理等

参考文献:

• 配置Nginx实现负载均衡 www.cnblogs.com/qlqwjy/p/85…
• 前端开发者必备的Nginx知识 juejin.im/post/5c85a6…
• Nginx与前端开发 juejin.im/post/5bacbd…
• 客户端内实时调试H5方案——nginx反向代理的使用 www.jianshu.com/p/4751d47dd…