经过上一篇内容讲的静态资源的优化,我们再次思考一个问题,假如在满足上述优化的前提下,我们传送一个 1M 的数据和一个 10M 的数据那个效率高?答案显而易见,传输内容小,速度就会快。那么问题又来了,同样的内容,如果把大小降下来,我们脑袋里面要蹦出一个词就是 “压缩”,接下来,我们来讲讲 Nginx 的静态资源压缩模块。
  在 Nginx 的配置文件中可以通过配置gzip来对静态资源进行压缩,相关的指令可以配置在 http 块、server 块和 location 块中,Nginx 可以通过下面这些模块对这些指令进行解析和处理。

1
2
3
ngx_http_gzip_module模块
ngx_http_gzip_static_module模块
ngx_http_gunzip_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
2
3
http{
gzip on;
}

  gzip_types指令: 该指令可以根据响应页的 MIME 类型选择性地开启 Gzip 压缩功能。

语法 gzip_types mime-type …
默认值 gzip_types text/html;
位置 http、server、location

  所选择的值可以从 mime.types 文件中进行查找,也可以使用 “*” 代表所有。

1
2
3
http{
gzip_types application/javascript;
}

  gzip_comp_level指令: 该指令用于设置 Gzip 压缩程度,级别从 1-9,1 表示要是程度最低,要是效率最高,9 刚好相反,压缩程度最高,但是效率最低最费时间。

语法 gzip_comp_level level
默认值 gzip_comp_level 1
位置 http、server、location
1
2
3
http{
gzip_comp_level 6;
}

  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
2
nignx计量大小的单位:bytes[字节] / kb[千字节] / M[兆]
例如: 1024 / 10k|K / 10m|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
2
3
4
5
6
7
8
9
gzip on;				#开启gzip功能
gzip_types *; #压缩源文件类型,根据具体的访问资源类型设定
gzip_comp_level 6; #gzip压缩级别
gzip_min_length 1024; #进行压缩响应页面的最小长度,contentlength
gzip_buffers 4 16K; #缓存空间大小
gzip_http_version 1.1; #指定压缩响应所需要的最低HTTP请求版本
gzip_vary on; #往头信息中添加压缩标识
gzip_disable "MSIE [1-6]\."; #对IE6以下的版本都不进行压缩
gzip_proxied off; #nginx作为反向代理压缩服务端返回数据的条件

  这些配置在很多地方可能都会用到,所以我们可以将这些内容抽取到一个配置文件中,然后通过include指令把配置文件再次加载到nginx.conf配置文件中,方法使用。
  nginx_gzip.conf

1
2
3
4
5
6
7
8
9
gzip on;
gzip_types *;
gzip_comp_level 6;
gzip_min_length 1024;
gzip_buffers 4 16K;
gzip_http_version 1.1;
gzip_vary on;
gzip_disable "MSIE [1-6]\.";
gzip_proxied off;

  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的实现步骤:

  1. 查询当前 Nginx 的配置参数:

    1
    nginx -v
  2. 将 nginx 安装目录下 sbin 目录中的 nginx 二进制文件进行更名:

    1
    2
    cd /usr/local/nginx/sbin
    mv nginx nginxold
  3. 进入 Nginx 的安装目录:

    1
    cd /home/soft/nginx-1.21.6
  4. 执行make clean清空之前编译的内容;

  5. 使用configure来配置参数:

    1
    ./configure --with-http_gzip_static_module
  6. 使用make命令进行编译;

  7. 将 objs 目录下的 nginx 二进制执行文件移动到 nginx 安装目录下的 sbin 目录中:

    1
    mv objs/nginx /usr/local/nginx/sbin
  8. 执行更新命令:

    1
    make upgrade

  gzip_static 测试使用:

  1. 直接访问http://localhost/jquery.js
  2. 使用 gzip 命令进行压缩:
    1
    2
    cd /usr/local/nginx/html
    gzip jquery.js
  3. 再次访问http://localhost/jquery.js