7.4.3 gzip与brotli压缩配置

gzip与brotli压缩配置#

压缩原理与适用场景#

gzip 与 brotli 对文本类资源进行压缩传输,降低带宽并提升首屏加载。适用内容:HTML、CSS、JS、JSON、XML、SVG。对已压缩格式(jpg、png、mp4、zip)收益低且增加 CPU。brotli 压缩率更高,依赖 HTTPS/HTTP2 的现代浏览器支持;gzip 兼容性更好,推荐两者共存并以 brotli 优先。

文章图片

安装与模块准备#

方式一:使用发行版自带模块(推荐)#

# Debian/Ubuntu
sudo apt update
sudo apt install -y nginx nginx-module-brotli

# RHEL/CentOS (需启用EPEL或官方仓库)
sudo yum install -y epel-release
sudo yum install -y nginx nginx-module-brotli

预期效果nginx -V 输出中包含 --with-http_gzip_static_module,brotli 以动态模块方式加载。

方式二:从源码编译 brotli 模块(示例)#

# 1) 准备源码与依赖
sudo apt install -y build-essential git libpcre3 libpcre3-dev zlib1g zlib1g-dev libssl-dev
git clone https://github.com/google/ngx_brotli.git /usr/local/src/ngx_brotli
cd /usr/local/src/ngx_brotli && git submodule update --init

# 2) 编译Nginx并带上brotli模块
wget http://nginx.org/download/nginx-1.24.0.tar.gz -O /usr/local/src/nginx.tar.gz
tar -xzf /usr/local/src/nginx.tar.gz -C /usr/local/src
cd /usr/local/src/nginx-1.24.0
./configure --with-http_ssl_module --add-module=/usr/local/src/ngx_brotli
make -j"$(nproc)"
sudo make install

命令解释
- --add-module:加入 brotli 第三方模块
- make install:安装到 /usr/local/nginx(可通过 nginx -V 验证)

gzip配置要点(含解释)#

  • 启用与压缩级别:平衡 CPU 与压缩率,生产常用 4~6
  • MIME 类型:确保 Content-Type 匹配才生效
  • 最小长度:小于阈值不压缩
  • 代理与旧客户端兼容:避免老旧浏览器问题
  • 传输优化:设置缓冲区与协议版本
# /etc/nginx/nginx.conf
http {
    # 1) 启用 gzip
    gzip on;
    # 2) 压缩等级:1-9,建议4-6
    gzip_comp_level 5;
    # 3) 小于1KB不压缩
    gzip_min_length 1024;
    # 4) 代理场景也压缩
    gzip_proxied any;
    # 5) 添加Vary头,区分不同编码缓存
    gzip_vary on;
    # 6) 指定类型(text/html 默认开启)
    gzip_types text/plain text/css application/javascript application/json application/xml image/svg+xml;
    # 7) 兼容旧浏览器
    gzip_disable "MSIE [1-6]\.";
    # 8) 传输优化
    gzip_http_version 1.1;
    gzip_buffers 16 8k;

    include /etc/nginx/conf.d/*.conf;
}

brotli配置要点(含解释)#

brotli 需模块支持,指令与 gzip 类似。

# /etc/nginx/nginx.conf
http {
    brotli on;
    brotli_comp_level 5;     # 1-11,建议4-6
    brotli_min_length 1024;
    brotli_types text/plain text/css application/javascript application/json application/xml image/svg+xml;

    include /etc/nginx/conf.d/*.conf;
}

gzip与brotli共存完整示例#

# /etc/nginx/conf.d/static.conf
server {
    listen 80;
    server_name example.com;
    root /data/www;

    location /static/ {
        # 静态资源
        expires 7d;
        add_header Cache-Control "public";

        # gzip
        gzip on;
        gzip_comp_level 5;
        gzip_min_length 1024;
        gzip_vary on;
        gzip_types text/plain text/css application/javascript application/json application/xml image/svg+xml;

        # brotli
        brotli on;
        brotli_comp_level 5;
        brotli_min_length 1024;
        brotli_types text/plain text/css application/javascript application/json application/xml image/svg+xml;
    }
}

验证与命令解释#

1) 检查配置语法与重载#

sudo nginx -t
sudo systemctl reload nginx

预期效果syntax is oktest is successful

2) 使用 curl 验证响应编码#

# 验证 gzip
curl -I -H 'Accept-Encoding: gzip' http://example.com/static/app.js

# 验证 brotli
curl -I -H 'Accept-Encoding: br' http://example.com/static/app.js

关键字段Content-Encoding: gzipContent-Encoding: br

3) 查看响应大小差异#

# 未压缩
curl -s -o /dev/null -w "raw_size=%{size_download}\n" http://example.com/static/app.js

# gzip
curl -s -H 'Accept-Encoding: gzip' -o /dev/null -w "gzip_size=%{size_download}\n" http://example.com/static/app.js

# brotli
curl -s -H 'Accept-Encoding: br' -o /dev/null -w "br_size=%{size_download}\n" http://example.com/static/app.js

常见问题与排错#

1) 未生效
- 检查 Content-Type 是否在 gzip_types/brotli_types
- 确认响应头是否被上游/CDN 覆盖
- 命令:

curl -I http://example.com/static/app.js

2) CPU 飙高
- 降低 brotli_comp_levelgzip_comp_level
- 对大文件关闭压缩

location /static/large/ { gzip off; brotli off; }

3) 缓存异常
- 确认存在 Vary: Accept-Encoding
- CDN 需透传 Accept-Encoding,否则命中错误缓存

练习#

1) 将 brotli_comp_level 从 4 调整到 6,比较 br_size 变化。
2) 配置只对 /static/ 生效,对 /upload/ 关闭压缩并验证响应头。
3) 使用 curl -I 验证 Vary: Accept-Encoding 是否存在并说明作用。