入門系列之在Nginx配置Gzip

騰訊雲加社群發表於2019-03-03
Nginx

歡迎大家前往騰訊雲+社群，獲取更多騰訊海量技術實踐乾貨哦~

本文由小鐵匠米蘭的v 發表於雲+社群專欄

簡介

網站載入的速度取決於瀏覽器必須下載的所有檔案的大小。減少要傳輸的檔案的大小可以使網站不僅載入更快，而且對於那些寬頻是按量計費的人來說也更友好。

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樣式表和一個jsJavaScript檔案。

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影像等其他型別檔案。

應用這些更改後，設定部分應如下所示：

/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 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;
. . .
複製程式碼

儲存並關閉檔案以退出。

要啟用新配置，請重新載入Nginx。

sudo systemctl reload nginx
複製程式碼

下一步是檢查配置的更改是否按預期工作。

第四步、驗證新配置

我們可以像在第2步中那樣測試它，方法是使用curl每個測試檔案並檢查Content-Encoding: gzip是否有輸出。

curl -H "Accept-Encoding: gzip" -I http://localhost/test.html
curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg
curl -H "Accept-Encoding: gzip" -I http://localhost/test.css
curl -H "Accept-Encoding: gzip" -I http://localhost/test.js
複製程式碼

現在，只有test.jpg影像檔案才能保持未壓縮狀態。在所有其他示例中，您應該能夠Content-Encoding: gzip在輸出中找到標頭。

如果是這種情況，您已gzip成功在Nginx中配置了壓縮！

結論

更改Nginx配置來使用gzip壓縮，是很容易的一件事，而且能帶來不錯的提，。不僅頻寬有限的訪問者會更快地收到該網站，而且Google也會對網站載入速度感到滿意。作為現代網路和使用的重要組成部分，網站的載入速度越來越受到關注，這gzip是改進它的一大步。

參考文獻：《How To Add the gzip Module to Nginx on Ubuntu 16.04》

問答

nginx多域名轉發？

相關閱讀

如何在CVM上設定SSH僅作檔案傳輸

如何備份你的MySQL資料庫

MySQL 8.0 版本功能變更介紹

此文已由作者授權騰訊雲+社群釋出，原文連結：https://cloud.tencent.com/developer/article/1158755?fromSource=waitui

歡迎大家前往騰訊雲+社群或關注雲加社群微信公眾號（QcloudCommunity），第一時間獲取更多海量技術實踐乾貨哦~

海量技術實踐經驗，盡在雲加社群！

相關文章