摘要：要知道，網(wǎng)站的打開速度取決於瀏覽器打開下載的網(wǎng)頁(yè)文件大小。如果傳輸?shù)捻?yè)面內(nèi)容文件減少，那你網(wǎng)站的打開速度一定會(huì)加快。特別是手機(jī)端的用戶，打開網(wǎng)站速度受限於移動(dòng)端網(wǎng)絡(luò)，所以壓縮網(wǎng)站頁(yè)面內(nèi)容顯得至關(guān)重要。

要知道，網(wǎng)站的打開速度取決於瀏覽器打開下載的網(wǎng)頁(yè)文件大小。如果傳輸?shù)捻?yè)面內(nèi)容文件減少，那你網(wǎng)站的打開速度一定會(huì)加快。特別是手機(jī)端的用戶，打開網(wǎng)站速度受限於移動(dòng)端網(wǎng)絡(luò)，所以壓縮網(wǎng)站頁(yè)面內(nèi)容顯得至關(guān)重要。

gzip是一種非常流行的數(shù)據(jù)壓縮方式。你可以在nginx配置中開啟gzip來壓縮網(wǎng)頁(yè)文件。然後，這些文件又由瀏覽器解壓縮，文件不會(huì)受任何。但是壓縮文件是會(huì)佔(zhàn)用服務(wù)器資源，所以最好壓縮那些效果比較好的文件。比如文本文件壓縮效果非常好，通常會(huì)縮小兩倍多。而JPG或PNG這類文件，本身就已經(jīng)進(jìn)行格式壓縮，所以再做二次壓縮，效果並不是特別明顯。

本文主要講一下如何配置nginx來開啟gzip壓縮。

環(huán)境

ubuntu 20.04服務(wù)器

root權(quán)限或具有sudo特權(quán)的非root用戶

一、創(chuàng)建測(cè)試文件

在這一步中，我們將在默認(rèn)的Nginx目錄中創(chuàng)建幾個(gè)測(cè)試文件。稍後我們將使用這些文件來檢查Nginx的默認(rèn)行為是否進(jìn)行g(shù)zip壓縮，並測(cè)試配置更改是否具有預(yù)期的效果。

首先，創(chuàng)建幾個(gè)測(cè)試文件，這些文件主要用來查看我們的gzip壓縮效果。gzip是不會(huì)分析文件內(nèi)容的，它主要通過文件擴(kuò)展名來判斷文件類型，如果還分析文件內(nèi)容，那整個(gè)效率就會(huì)大大降低。所以我們可以創(chuàng)建一些圖像文件、html文件和一些樣式文件。

sudo truncate -s 1k /var/www/html/test.html
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

下一步是檢查Nginx在使用我們剛創(chuàng)建的文件在全新安裝中壓縮請(qǐng)求的文件時(shí)的行為。

二、命令方式查看壓縮效果

使用curl命令方式，添加標(biāo)頭Accept-Encoding:?gzip，來查看各文件的壓縮結(jié)果。

curl -H “Accept-Encoding:?gzip” -I http://localhost/test.html

可以看到以下結(jié)果：

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:04:25 GMT

Content-Type:?text/html

Last-Modified: Tue, 09 Feb 2021 19:03:41 GMT

Connection: keep-alive

ETag: W/”6022dc8d-400″

Content-Encoding:?gzip

在最後一行，出現(xiàn)Content-Encoding:?gzip字樣。說明服務(wù)器正在用gzip壓縮來發(fā)送文件。默認(rèn)情況下，nginx僅壓縮html文件。所有在這個(gè)命令中可以看到文件做了壓縮處理。但其它的文件格式，並未做壓縮處理。

可以通過下面這條命令來驗(yàn)證我們剛才的說法。

curl -H “Accept-Encoding:?gzip” -I http://localhost/test.jpg

再看一下結(jié)果，和之前的有所不同：

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:05:49 GMT

Content-Type: image/jpeg

Content-Length: 1024

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

ETag: “6022dc91-400”

Accept-Ranges: bytes

輸出結(jié)果中沒有出現(xiàn)Content-Encoding:?gzip，這意味著該文件並沒有做任何的壓縮。

你也可以使用這個(gè)方法來測(cè)試css等樣式文件。

curl -H “Accept-Encoding:?gzip” -I http://localhost/test.css

結(jié)果一樣，沒有出現(xiàn)Content-Encoding:?gzip

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:06:04 GMT

Content-Type:?text/css

Content-Length: 1024

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

ETag: “6022dc91-400”

Accept-Ranges: bytes

三、配置Nginx開啟gzip功能

本節(jié)主要操作相關(guān)配置，讓gzip可以處理其它幾種文件格式的壓縮。

你可以使用nano或vim編輯nginx的配置文件。

sudo nano /etc/nginx/nginx.conf

找到gzip設(shè)置部分，如下所示：

/etc/nginx/nginx.conf

. . .
##
# `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;
. . .

因?yàn)槲覀冇玫氖莡buntu 20.04。所以默認(rèn)情況下，gzip是開啟的。但有些設(shè)置無效，所以我們需要做一些修改：

通過取消註釋行前面的#來啟用其他設(shè)置（即，刪除#符號(hào)）

添加gzip_min_length 256;參數(shù)，該參數(shù)是告訴nginx，不要去壓縮小於256字節(jié)的文件，因?yàn)楹苄〉奈募]有太必要。壓縮這類文件反而影響服務(wù)器效率。

在gzip_types參數(shù)中添加其他文件類型擴(kuò)展名，這些文件類型可以是Web字體，圖片、XML、JSON結(jié)構(gòu)化數(shù)據(jù)或SVG圖片文件。

應(yīng)用這些更改之後，設(shè)置部分應(yīng)如下所示：

/etc/nginx/nginx.conf

. . .
##
# `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_min_length 256;
gzip_types
application/atom+xml
application/geo+json
application/javascript
application/x-javascript
application/json
application/ld+json
application/manifest+json
application/rdf+xml
application/rss+xml
application/xhtml+xml
application/xml
font/eot
font/otf
font/ttf
image/svg+xml
text/css
text/javascript
text/plain
text/xml;
. . .

保存並關(guān)閉文件以退出。要啟用新配置，需要重新啟動(dòng)Nginx：

sudo systemctl restart nginx

四、確保所有的配置正確

重複之前的測(cè)試步驟，執(zhí)行相應(yīng)的命令請(qǐng)求：

curl -H “Accept-Encoding:?gzip” -I http://localhost/test.html

因?yàn)閔tml文件，之前已經(jīng)默認(rèn)開啟壓縮，所以這個(gè)命令執(zhí)行結(jié)果保持不變：

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:04:25 GMT

Content-Type:?text/html

Last-Modified: Tue, 09 Feb 2021 19:03:41 GMT

Connection: keep-alive

ETag: W/”6022dc8d-400″

Content-Encoding:?gzip

然後我們來測(cè)試一下之前未壓縮的css樣式表，看看結(jié)果會(huì)有什麼變化：

curl -H “Accept-Encoding:?gzip” -I http://localhost/test.css

可以看到gzip正在壓縮文件：

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:21:54 GMT

Content-Type:?text/css

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

Vary: Accept-Encoding

ETag: W/”6022dc91-400″

Content-Encoding:?gzip

我們可以用相同的方式測(cè)試一下jpg文件：

curl -H “Accept-Encoding:?gzip” -I http://localhost/test.jpg

沒有看到gzip壓縮：

Output

HTTP/1.1 200 OK

Server: nginx/1.18.0 (Ubuntu)

Date: Tue, 09 Feb 2021 19:25:40 GMT

Content-Type: image/jpeg

Content-Length: 1024

Last-Modified: Tue, 09 Feb 2021 19:03:45 GMT

Connection: keep-alive

ETag: “6022dc91-400”

Accept-Ranges: bytes

因?yàn)樵谥暗呐渲弥?，我們並沒有添加 image/jpeg。

在這種情況下，我們已經(jīng)在Nginx中成功配置了gzip。

結(jié)論

可以看出，gzip很容易配置，而且?guī)淼乃俣忍嵘卜浅Ｃ黠@，搜索引擎也非常喜歡這類加載方式，如果想提高搜索引擎的排名，增加gzip是非常有必要的。

來源：投稿。