本文作者:阿豪

Nginx开启Brotli压缩详细教程

阿豪 2个月前 ( 05-09 ) 210
Nginx开启Brotli压缩详细教程摘要: Brotli 是 google 开发的文本压缩算法,比起gzip可能会有高达37%的提升。主流浏览器都支持br算法,建议大家升级改算法。使用算法的前提是启用了 https,因为 h...

Brotli 是 google 开发的文本压缩算法,比起gzip可能会有高达37%的提升。主流浏览器都支持br算法,建议大家升级改算法。使用算法的前提是启用了 https,因为 http 请求中 request header 里的 Accept-Encoding: gzip, deflate 是没有 br 的。

下载必要软件

ngx_brotli官网

https://github.com/google/ngx_brotli

下载ngx_brotli

# cd /usr/local/src/

# yum install git -y

# git clone https://github.com/google/ngx_brotli

# cd ngx_brotli

# git submodule update --init

下载Nginx

# yum install wget gcc pcre-devel zlib-devel openssl openssl-devel -y 

# cd /usr/local/src/

# wget http://nginx.org/download/nginx-1.20.0.tar.gz

# tar -zxvf nginx-1.20.0.tar.gz

# cd nginx-1.20.0

# ./configure --prefix=/usr/local/nginx  --add-module=/usr/local/src/ngx_brotli  --with-http_ssl_module

# make && make install

配置Nginx的全局配置文件

本篇教程Nginx配置文件在/usr/local/nginx/conf/nginx.conf

在http {配置段中适当的位置添加

#Brotli Compression
brotli on;
brotli_comp_level 6;
brotli_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript image/svg+xml;

Brotli和gzip是可以并存的,无需关闭gzip。

http {
    ...
    # gzip
    gzip on;
    gzip_min_length 1k;
    gzip_buffers 4 32k;
    gzip_http_version 1.1;
    gzip_comp_level 5;
    gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript;
    gzip_vary on;
    gzip_proxied any;
    gzip_disable "MSIE [1-6]\.";

    # brotli
    brotli on;
    brotli_comp_level 6;
    brotli_buffers 16 8k;
    brotli_min_length 20;
    brotli_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript image/svg+xml;
    ...
}

验证配置文件是否正常

# /usr/local/nginx/sbin/nginx -t

重启Nginx服务

测试

# curl -IL https://blog.ahaoyw.com/ -H "Accept-Encoding: br"

image.png

使用浏览器工具

检查(按F12) > Network > Headers > "Response Headers" > "Content-Encoding" header,发现有content-encoding:br

image.png


文章版权及转载声明

作者:阿豪本文地址:https://www.ahaoyw.com/article/578.html发布于 2个月前 ( 05-09 )
文章转载或复制请以超链接形式并注明出处Ahao.Yw • 挨踢仔博客

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏