Nginx 从入门到入坟(六)- Nginx 实现静态资源压缩
经过上一篇内容讲的静态资源的优化,我们再次思考一个问题,假如在满足上述优化的前提下,我们传送一个 1M 的数据和一个 10M 的数据那个效率高?答案显而易见,传输内容小,速度就会快。那么问题又来了,同样的内容,如果把大小降下来,我们脑袋里面要蹦出一个词就是 “压缩”,接下来,我们来讲讲 Nginx 的静态资源压缩模块。
在 Nginx 的配置文件中可以通过配置gzip
来对静态资源进行压缩,相关的指令可以配置在 http 块、server 块和 location 块中,Nginx 可以通过下面这些模块对这些指令进行解析和处理。
1 | ngx_http_gzip_module模块 |
接下来我们讲说说下面几个方面:
- Gzip各模块支持的配置指令
- Gzip压缩功能的配置
- Gzip和sendfile的冲突解决
- 浏览器不支持Gzip的解决方案
1. Gzip模块配置指令
接下来所说的指令都来自ngx_http_gzip_module
模块,该模块会在 Nginx 安装的时候内置到 Nginx 的安装环境中,也就是说我们可以直接使用这些指令。
gzip指令: 该指令用于开启或者关闭 gzip 功能。
语法 | gzip on|off |
---|---|
默认值 | gzip off; |
位置 | http、server、location… |
注意只有该指令为打开状态,下面的指令才有效果:
1 | http{ |
gzip_types指令: 该指令可以根据响应页的 MIME 类型选择性地开启 Gzip 压缩功能。
语法 | gzip_types mime-type … |
---|---|
默认值 | gzip_types text/html; |
位置 | http、server、location |
所选择的值可以从 mime.types 文件中进行查找,也可以使用 “*” 代表所有。
1 | http{ |
gzip_comp_level指令: 该指令用于设置 Gzip 压缩程度,级别从 1-9,1 表示要是程度最低,要是效率最高,9 刚好相反,压缩程度最高,但是效率最低最费时间。
语法 | gzip_comp_level level |
---|---|
默认值 | gzip_comp_level 1 |
位置 | http、server、location |
1 | http{ |
gzip_vary指令: 该指令用于设置使用 Gzip 进行压缩发送是否携带 “Vary:Accept-Encoding” 头域的响应头部。主要是告诉接收方,所发送的数据经过了 Gzip 压缩处理。
语法 | gzip_vary on|off |
---|---|
默认值 | gzip_vary off; |
位置 | http、server、location |
gzip_buffers指令: 该指令用于处理请求压缩的缓冲区数量和大小。
语法 | gzip_buffers number size |
---|---|
默认值 | gzip_buffers 32 4k |
位置 | http、server、location |
number
指定 Nginx 服务器向系统申请缓存空间个数,size
指的是每个缓存空间的大小。主要实现的是申请 number 个每个大小为 size 的内存空间。这个值的设定一般会和服务器的操作系统有关,所以建议此项不设置,使用默认值即可。
1 | gzip_buffers 4 16K; #缓存空间大小 |
gzip_disable指令: 针对不同种类客户端发起的请求,可以选择性地开启和关闭 Gzip 功能。
语法 | gzip_disable regex … |
---|---|
默认值 | - |
位置 | http、server、location |
regex
:根据客户端的浏览器标志(user-agent)来设置,支持使用正则表达式。指定的浏览器标志不使用Gzip.
该指令一般是用来排除一些明显不支持 Gzip 的浏览器。
1 | gzip_disable "MSIE [1-6]\."; |
gzip_http_version指令: 针对不同的 HTTP 协议版本,可以选择性地开启和关闭 Gzip 功能。
语法 | gzip_http_version 1.0|1.1 |
---|---|
默认值 | gzip_http_version 1.1 |
位置 | http、server、location |
该指令是指定使用 Gzip 的 HTTP 最低版本,该指令一般采用默认值即可。
gzip_min_length指令: 该指令针对传输数据的大小,可以选择性地开启和关闭 Gzip 功能。
语法 | gzip_min_length length |
---|---|
默认值 | gzip_min_length 20 |
位置 | http、server、location |
1 | nignx计量大小的单位:bytes[字节] / kb[千字节] / M[兆] |
Gzip 压缩功能对大数据的压缩效果明显,但是如果要压缩的数据比较小的化,可能出现越压缩数据量越大的情况,因此我们需要根据响应内容的大小来决定是否使用 Gzip 功能,响应页面的大小可以通过头信息中的 Content-Length 来获取。但是如何使用了 Chunk 编码动态压缩,该指令将被忽略。建议设置为 1K 或以上。
gzip_proxied指令: 该指令设置是否对服务端返回的结果进行 Gzip 压缩。
语法 | gzip_proxied off|expired|no-cache|nostore|private|no_last_modified|no_etag|auth|any |
---|---|
默认值 | gzip_proxied off |
位置 | http、server、location |
- off:关闭 Nginx 服务器对后台服务器返回结果的 Gzip 压缩;
- expired:启用压缩,如果 header 头中包含 “Expires” 头信息;
- no-cache:启用压缩,如果 header 头中包含 “Cache-Control:no-cache” 头信息;
- no-store:启用压缩,如果 header 头中包含 “Cache-Control:no-store” 头信息;
- private:启用压缩,如果 header 头中包含 “Cache-Control:private” 头信息;
- no_last_modified:启用压缩,如果 header 头中不包含 "Last-Modified"头信息 ;
- no_etag:启用压缩,如果 header 头中不包含 “ETag” 头信息;
- auth:启用压缩 , 如果 header 头中包含 “Authorization” 头信息;
- any:无条件启用压缩;
2. Gzip压缩功能的实例配置
1 | gzip on; #开启gzip功能 |
这些配置在很多地方可能都会用到,所以我们可以将这些内容抽取到一个配置文件中,然后通过include
指令把配置文件再次加载到nginx.conf
配置文件中,方法使用。
nginx_gzip.conf
:
1 | gzip on; |
nginx.conf
:
1 | include nginx_gzip.conf |
3. Gzip和sendfile共存问题
前面在讲 sendfile 的时候,提到过,开启 sendfile 以后,在读取磁盘上的静态资源文件的时候,可以减少拷贝的次数,可以不经过用户进程将静态文件通过网络设备发送出去,但是 Gzip 要想对资源压缩,是需要经过用户进程进行操作的。所以如何解决两个设置的共存问题。
可以使用ngx_http_gzip_static_module
模块的gzip_static
指令来解决。
gzip_static: 检查与访问资源同名的.gz
文件时,response 中以 gzip 相关的 header 返回.gz
文件的内容。
语法 | gzip_static on|off|always |
---|---|
默认值 | gzip_static off; |
位置 | http、server、location |
添加上述命令后,会报一个错误,unknown directive "gzip_static"
,主要的原因是 Nginx 默认是没有添加ngx_http_gzip_static_module
模块。如何来添加?
添加模块到Nginx的实现步骤:
-
查询当前 Nginx 的配置参数:
1
nginx -v
-
将 nginx 安装目录下 sbin 目录中的 nginx 二进制文件进行更名:
1
2cd /usr/local/nginx/sbin
mv nginx nginxold -
进入 Nginx 的安装目录:
1
cd /home/soft/nginx-1.21.6
-
执行
make clean
清空之前编译的内容; -
使用
configure
来配置参数:1
./configure --with-http_gzip_static_module
-
使用
make
命令进行编译; -
将 objs 目录下的 nginx 二进制执行文件移动到 nginx 安装目录下的 sbin 目录中:
1
mv objs/nginx /usr/local/nginx/sbin
-
执行更新命令:
1
make upgrade
gzip_static 测试使用:
- 直接访问
http://localhost/jquery.js
:
- 使用 gzip 命令进行压缩:
1
2cd /usr/local/nginx/html
gzip jquery.js - 再次访问
http://localhost/jquery.js
: