nginx gzip 压缩传输

nginx gzip 压缩说明

关于nginx压缩传输分为 gzip在线压缩 和 gzip_static 静态压缩

• 在线压缩：gzip

　　　客户端请求服务器资源时，根据设置实时压缩并响应客户端浏览器，压缩本身会消耗nginx本地资源；

• 静态压缩：http_gzip_static_module

　　在用户访问相关资源如js、css、图片等类型文件时，会自动识别对应的.gz压缩文件，传输给客户端/浏览器，省去了nginx本地压缩的环节。

　　详细可以参考nginx官方资料：

　　https://nginx.org/en/docs/http/ngx_http_gzip_static_module.html

 

前端开发构建说明

前端开发在构建bundle时，可以使用webpack 插件根据预定算法或条件对部分代码压缩为.gz 文件

nginx gzip_static 可以在用户访问相关资源如js、css时，会自动识别是否存在.gz压缩文件，

如果存在，可直接传送.gz 文件给客户端浏览器，增加传输速度，节省带宽资源，提高用户体验。

nginx gzip 静态压缩示例

关于nginx 启动gzip压缩的整体方案配置示例如下

server {
    # 监听端口
    listen 80;
    server_name domain.com;

    # 做静态压缩后为防止gz文件被直接下载
    # 添加正则表达，当访问gz结尾的文件是重定向到主页或者直接deny all 
    location ~* \.(gz|zip)$ {

    deny all;
    # deny all 或者 rewrite 
    # rewrite ^(.*)$ http://$host/index.html  permanent;
    }
    location / {
        root /usr/share/nginx/html;
        index index.html index.html.gz;

        # 静态压缩
        # gzip_static 上客户端浏览器访问服务器上已事先压缩到gz文件
        # 文件类型见gzip_types
        gzip_static on;
        gzip_vary on;

        # 10k 以上的文件nginx自动压缩传送给客户端浏览器
        gzip             on;
        gzip_min_length 10k;
        gzip_buffers 4 16k;
        gzip_comp_level 6;
        gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript image/jpeg im
age/gif image/png;
        gzip_disable "MSIE [1-6]\.";

    }
}