欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~
简介
网站加载的速度取决于浏览器必须下载的所有文件的大小。减少要传输的文件的大小可以使网站不仅加载更快,而且对于那些宽带是按量计费的人来说也更友好。
gzip
是一种流行的数据压缩程序。您可以使用
gzip
压缩Nginx实时文件。这些文件在检索时由支持它的浏览器解压缩,好处是web服务器和浏览器之间传输的数据量更小,速度更快。
gzip
不一定适用于所有文件的压缩。例如,文本文件压缩得非常好,通常会缩小两倍以上。另一方面,诸如JPEG或PNG文件之类的图像已经按其性质进行压缩,使用
gzip
压缩很难有好的压缩效果或者甚至没有效果。压缩文件会占用服务器资源,因此最好只压缩那些压缩效果好的文件。
在本指南中,我们将讨论如何配置安装在Ubuntu 16.04服务器上的Nginx,以利用
gzip
压缩,来减少发送给网站访问者的文件的大小。
必备条件
要学习本教程,您需要:
- 一个已安装Nginx的Ubuntu 16.04服务器,没有服务器的同学可以在 这个 页面购买。 关于Nginx搭建,可以参考腾讯云开发者实验室的这个教程: cloud.tencent.com/developer/l…
第一步、创建测试文件
这一步中,我们将在默认的Nginx目录中创建几个测试文件来进行测试
gzip
的压缩效果。
Nginx不会分析文件内容,他只分析文件后缀,所以,它只是查找文件扩展名以确定其 MIME类型 ,这样nginx就会对不同的文件作出不同的压缩处理。
因为只是测试,所以测试文件的内容无关紧要。通过适当的更改文件名,我们可以欺骗Nginx,让Nginx认为这个文件是图像或者是js脚本。
在我们的配置中,Nginx不会压缩非常小的文件,因此我们将创建大小恰好为1KB的测试文件。这将让我们验证Nginx是否使用压缩,压缩一种类型的文件而不是其他类型的文件。
使用创建
truncate
在默认Nginx目录中命名的1 KB文件
test.html
。扩展名表示它是一个HTML页面。
sudo truncate -s 1k /var/www/html/test.html
复制代码
让我们以相同的方式创建一些测试文件:一个
jpg
图像文件,一个
css
样式表和一个
js
JavaScript文件。
sudo truncate -s 1k /var/www/html/test.jpg
sudo truncate -s 1k /var/www/html/test.css
sudo truncate -s 1k /var/www/html/test.js
复制代码
下一步是检查NGIX如何对刚刚创建的文件进行压缩。
第二步、检查默认行为
让我们检查名为
test.html
的HTML文件是否被压缩。该命令从我们的Nginx服务器请求一个文件,并指定使用HTTP头(
Accept-Encoding: gzip
)来查找
gzip
压缩的内容。
curl -H "Accept-Encoding: gzip" -I http://localhost/test.html
复制代码
作为响应,您应该看到几个HTTP响应标头:
Nginx响应头
HTTP/1.1 200 OK
Server: nginx/1.4.6 (Ubuntu)
Date: Tue, 19 Jan 2016 20:04:12 GMT
Content-Type: text/html
Last-Modified: Tue, 04 Mar 2014 11:46:45 GMT
Connection: keep-alive
Content-Encoding: gzip
复制代码
在最后一行中,您可以看到
Content-Encoding: gzip
。这告诉我们
gzip
压缩已用于发送此文件。这是因为在Ubuntu 16.04上,Nginx的
gzip
在安装后使用默认设置自动启用了压缩。
但是,默认情况下,Nginx仅压缩HTML文件。新安装中的每个其他文件都将以未压缩的形式提供。要验证这一点,您可以请求以
test.jpg
相同方式命名的测试图像。
curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg
复制代码
结果应该与以前略有不同:
Nginx响应头
HTTP/1.1 200 OK
Server: nginx/1.4.6 (Ubuntu)
Date: Tue, 19 Jan 2016 20:10:34 GMT
Content-Type: image/jpeg
Content-Length: 0
Last-Modified: Tue, 19 Jan 2016 20:06:22 GMT
Connection: keep-alive
ETag: "569e973e-0"
Accept-Ranges: bytes
复制代码
Content-Encoding: gzip
没有输出,这意味着文件是在没有压缩的情况下提供。
您可以使用测试CSS样式表重复测试。
curl -H "Accept-Encoding: gzip" -I http://localhost/test.css
复制代码
再一次,输出中没有提到压缩。
CSS文件的Nginx响应头
HTTP/1.1 200 OK
Server: nginx/1.4.6 (Ubuntu)
Date: Tue, 19 Jan 2016 20:20:33 GMT
Content-Type: text/css
Content-Length: 0
Last-Modified: Tue, 19 Jan 2016 20:20:33 GMT
Connection: keep-alive
ETag: "569e9a91-0"
Accept-Ranges: bytes
复制代码
下一步是将Nginx配置支持其他类型文件的压缩。
第三步、配置Nginx的gzip设置
要更改Nginx的
gzip
配置,请使用
nano
或者其他您喜欢的编辑器,来打开的Nginx主要配置文件。
sudo nano /etc/nginx/nginx.conf
复制代码
找到
gzip
设置部分,如下所示:
. . .
##
# `gzip` Settings
#
#
gzip on;
gzip_disable "msie6";
# gzip_vary on;
# gzip_proxied any;
# gzip_comp_level 6;
# gzip_buffers 16 8k;
# gzip_http_version 1.1;
# gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;
. . .
复制代码
您可以看到默认情况下,指令
gzip
启用了压缩
gzip on
,但使用
#
注释符号注释了几个其他设置。我们将对此部分进行一些更改:
-
通过取消注释所有注释行来启用其他设置(就是删除
#
) -
添加
gzip_min_length 256;
指令,告诉Nginx不要压缩小于256字节的文件。这是非常小的文件,可以不用压缩 -
gzip_types
是表示压缩的文件类型,还可以添加web字体格式、ioc图标和SVG图像等其他类型文件。
应用这些更改后,设置部分应如下所示: