简介
网站的加载速度取决于浏览器需要下载的所有文件的大小。减小需要传输的文件大小不仅能加快网站的加载速度,还能降低带宽使用费用。
gzip
是一个流行的数据压缩程序。你可以配置 Nginx 使用 gzip
来即时压缩它提供的文件。然后,支持该程序的浏览器会在检索时解压缩这些文件,不会造成任何损失,但网络服务器和浏览器之间传输的数据量会减少。
由于压缩的一般工作方式以及 gzip
的工作方式,某些文件比其他文件压缩得更好。例如,文本文件的压缩效果非常好,通常压缩后的文件体积会缩小两倍以上。另一方面,JPEG 或 PNG 等图像文件本质上已经压缩,使用 gzip
进行二次压缩几乎不会产生任何效果。压缩文件会占用服务器资源,因此最好只压缩那些能显著减小文件大小的文件。
在本指南中,我们将讨论如何配置安装在 Ubuntu 14.04 服务器上的 Nginx,以利用 "gzip "压缩技术来减小发送给网站访问者的内容大小。
先决条件
要学习本教程,您需要
- 一台 Ubuntu 14.04 服务器,使用 sudo 非 root 用户
- 按照如何在 Ubuntu 14.04 上安装 Nginx 教程 在服务器上安装 Nginx。
步骤 1 - 创建测试文件
在这一步中,我们将在默认 Nginx 目录中创建几个测试文件,以验证 gzip
的压缩效果。
在决定通过网络提供何种文件时,Nginx 不会分析文件内容,因为这样做速度不够快。取而代之的是,它只查找文件扩展名,以确定文件的 _MIME 类型,即文件的用途。
由于这种行为,测试文件的内容无关紧要。通过对文件进行适当命名,我们可以欺骗 Nginx,让它认为一个完全空白的文件是图像,而另一个则是样式表。
在我们的配置中,Nginx不会压缩非常小的文件,因此我们将创建大小正好为1千字节的测试文件。这样我们就可以验证Nginx是否在应该压缩的地方使用了压缩,压缩了一种类型的文件,而没有压缩其他类型的文件。
使用 truncate
在 Nginx 默认目录下创建一个 1 千字节的文件,名为 test.html
。扩展名表示这是一个 HTML 页面。
1sudo truncate -s 1k /usr/share/nginx/html/test.html
让我们以同样的方式再创建几个测试文件:一个 jpg
图像文件、一个 css
样式表和一个 js
JavaScript 文件。
1sudo truncate -s 1k /usr/share/nginx/html/test.jpg
2sudo truncate -s 1k /usr/share/nginx/html/test.css
3sudo truncate -s 1k /usr/share/nginx/html/test.js
第 2 步 - 检查默认行为
下一步是检查 Nginx 在新安装时如何使用我们刚刚创建的文件进行压缩。
让我们检查名为 test.html
的 HTML 文件是否经过压缩。该命令从 Nginx 服务器请求一个文件,并使用 HTTP 标头("Accept-Encoding: gzip")指定可以提供 "gzip "压缩内容。
1curl -H "Accept-Encoding: gzip" -I http://localhost/test.html
对此,您应该会看到几个 HTTP 响应头:
1[label Nginx response headers]
2HTTP/1.1 200 OK
3Server: nginx/1.4.6 (Ubuntu)
4Date: Tue, 19 Jan 2016 20:04:12 GMT
5Content-Type: text/html
6Last-Modified: Tue, 04 Mar 2014 11:46:45 GMT
7Connection: keep-alive
8Content-Encoding: gzip
在最后一行,你可以看到 Content-Encoding: gzip
标头。这告诉我们,发送该文件时使用了gzip
压缩。这是因为在 Ubuntu 14.04 上,Nginx 在安装后自动启用了默认设置下的 gzip
压缩。
不过,默认情况下,Nginx 只压缩 HTML 文件。新安装的所有其他文件都是未压缩的。要验证这一点,可以用同样的方法请求名为 "test.jpg "的测试图片。
1curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg
结果应该与之前略有不同:
1[label Nginx response headers]
2HTTP/1.1 200 OK
3Server: nginx/1.4.6 (Ubuntu)
4Date: Tue, 19 Jan 2016 20:10:34 GMT
5Content-Type: image/jpeg
6Content-Length: 0
7Last-Modified: Tue, 19 Jan 2016 20:06:22 GMT
8Connection: keep-alive
9ETag: "569e973e-0"
10Accept-Ranges: bytes
输出中没有 "Content-Encoding: gzip"(内容编码:gzip)标头,这意味着文件是在未压缩的情况下提供的。
您可以使用测试 CSS 样式表重复该测试。
1curl -H "Accept-Encoding: gzip" -I http://localhost/test.css
同样,输出中也没有提到压缩。
1[label Nginx response headers for CSS file]
2HTTP/1.1 200 OK
3Server: nginx/1.4.6 (Ubuntu)
4Date: Tue, 19 Jan 2016 20:20:33 GMT
5Content-Type: text/css
6Content-Length: 0
7Last-Modified: Tue, 19 Jan 2016 20:20:33 GMT
8Connection: keep-alive
9ETag: "569e9a91-0"
10Accept-Ranges: bytes
第 3 步 - 配置 Nginx 的 gzip 设置
下一步是配置 Nginx,使其不仅能提供压缩的 HTML 文件,还能提供其他可从压缩中受益的文件格式。
要更改Nginx的 "gzip "配置,用 "nano "或你喜欢的文本编辑器打开Nginx的主配置文件。
1sudo nano /etc/nginx/nginx.conf
找到 gzip
设置部分,如下所示:
1[label /etc/nginx/nginx.conf]
2. . .
3##
4# `gzip` Settings
5#
6#
7gzip on;
8gzip_disable "msie6";
9
10# gzip_vary on;
11# gzip_proxied any;
12# gzip_comp_level 6;
13# gzip_buffers 16 8k;
14# gzip_http_version 1.1;
15# gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;
16. . .
你可以看到,默认情况下,"gzip "压缩是通过 "gzip on "指令启用的,但还有一些设置用 "# "注释符号注释掉了。我们将对这一部分进行几处修改:
- 启用附加设置,取消所有注释行(即删除行首的
#
)。 - 添加 "gzip_min_length 256; "指令,告诉Nginx不要压缩小于256字节的文件。这是因为很小的文件几乎无法从压缩中受益。
- 在 "gzip_types "指令中添加表示网络字体、"ico "图标和 SVG 图像的文件类型。
应用这些更改后,设置部分应如下所示:
1[label /etc/nginx/nginx.conf]
2. . .
3##
4# `gzip` Settings
5#
6#
7gzip on;
8gzip_disable "msie6";
9
10gzip_vary on;
11gzip_proxied any;
12gzip_comp_level 6;
13gzip_buffers 16 8k;
14gzip_http_version 1.1;
15gzip_min_length 256;
16gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml image/x-icon;
17. . .
保存并关闭文件退出。
要启用新配置,请重启 Nginx。
1sudo service nginx restart
第 4 步 - 验证新配置
下一步是检查配置更改是否达到预期效果。
我们可以像步骤 2 一样,在每个测试文件上使用 curl
,并检查 Content-Encoding: gzip
标头的输出,来测试这一点。
1curl -H "Accept-Encoding: gzip" -I http://localhost/test.html
2curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg
3curl -H "Accept-Encoding: gzip" -I http://localhost/test.css
4curl -H "Accept-Encoding: gzip" -I http://localhost/test.js
现在只有图片文件 test.jpg
应保持未压缩状态。在所有其他示例中,你应该能在输出中找到 Content-Encoding: gzip
标头。
如果是这种情况,那么您已经在 Nginx 中成功配置了 gzip
压缩!
结论
更改 Nginx 配置以完全使用 "gzip "压缩很容易,但好处却是巨大的。不仅带宽有限的访问者可以更快地访问网站,谷歌也会对网站加载速度更快感到高兴。作为现代网络的重要组成部分,速度正日益受到重视,而使用 gzip
就是改善速度的一大举措。