最近在替别人部署一个业务的时候，因为 JS 和 CSS 这类的静态文件占比很多，于是想给他的 Nginx 装上 Brotli 的 Module，这样能比自带的 Gzip 带来更大的压缩比和更小的资源占用。

因为他用的是宝塔的面板，不能用常规的模式给 Nginx 装 Module，查询了一些资料后，整理出下面的安装教程。

下载 Brotli

首先在SSH里面执行以下操作：

进入宝塔的环境目录

1

cd /www/server

创建nginx_module目录

1

mkdir nginx_module

进入 nginx_module目录

1

cd nginx_module

下载 brotli

1

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

进入 ngx_brotli 目录

1

cd ngx_brotli

更新子模块

1

git submodule update --init

编译安装 Brotli

在宝塔的软件商店的运行环境一栏下，找到 Nginx，点击安装，选择编译安装，然后再点击添加自定义模块。

接着填写以下内容：

• 模块名称：ngx_brotli
• 模块描述：ngx_brotli
• 模块参数：--add-module=/www/server/nginx_module/ngx_brotli
• 前置脚本：cd /www/server/nginx_module/ngx_brotli && git submodule update --init

添加好之后，请注意勾选上刚才添加的 ngx_brotli 模块，再点击提交，等待 Nginx 编译安装好即可。

编译安装成功后，在 SSH 里面执行nginx -V，如果有出现--add-module=/www/server/nginx_module/ngx_brotli则说明 Brotli 添加成功了。

配置 Brotli

光安装上 Btotli 还不够，还得需要在 Nginx 的配置里面添加上以下内容：

1
2
3
4
5
6

brotli on;
brotli_min_length 0;
brotli_buffers 16 8k;
brotli_comp_level 6;
brotli_static on;
brotli_types application/atom+xml application/javascript application/json application/rss+xml application/vnd.ms-fontobject application/x-font-opentype application/x-font-truetype application/x-font-ttf application/x-javascript application/xhtml+xml application/xml font/eot font/opentype font/otf font/truetype image/svg+xml image/vnd.microsoft.icon image/x-icon image/x-win-bitmap text/css text/javascript text/plain text/xml;

保存之后，重载一下 Nginx 的配置，或者重启 Nginx。

打开浏览器的开发者工具F12，如果 JS 和 CSS 这类在压缩列表内的文件的响应标头里面content-encoding值为br，则说明 Brotli 已经成功应用并生效了。