序章

Webサイトの読み込み速度は、ブラウザでダウンロードする必要のあるすべてのファイルのサイズによって異なります。 送信するファイルのサイズを小さくすると、Webサイトの読み込みが速くなるだけでなく、帯域幅の使用量を支払う必要がある人にとっても安価になります。

gzipは人気のあるデータ圧縮プログラムです。 使用するようにNginxを構成できます gzip その場で提供するファイルを圧縮します。 これらのファイルは、取得時にそれをサポートするブラウザによって解凍されますが、Webサーバーとブラウザ間で転送されるデータの量が少ないという利点があります。

圧縮が一般的に機能する方法だけでなく、どのように機能するか gzip 動作し、特定のファイルは他のファイルよりも圧縮率が高くなります。 たとえば、テキストファイルは非常によく圧縮され、結果として2分の1以上小さくなることがよくあります。 一方、JPEGやPNGファイルなどの画像は、その性質上すでに圧縮されており、2番目の圧縮は gzip 結果はほとんどまたはまったくありません。 ファイルを圧縮するとサーバーリソースが消費されるため、結果としてサイズが大幅に減少するファイルのみを圧縮することをお勧めします。

このガイドでは、CentOS7サーバーにインストールされているNginxを構成して利用する方法について説明します。 gzip Webサイトの訪問者に送信されるコンテンツのサイズを縮小するための圧縮。

前提条件

このチュートリアルに従うには、次のものが必要です。

ステップ1—テストファイルの作成

このステップでは、デフォルトのNginxディレクトリにいくつかのテストファイルを作成してテキストを送信します gzipの圧縮。

ネットワーク上で提供されるファイルの種類を決定するために、Nginxはファイルの内容を分析しません。これは、十分な速度が得られないためです。 代わりに、ファイル拡張子を検索して、ファイルの目的を示すMIMEタイプを判別します。

この動作のため、テストファイルの内容は関係ありません。 ファイルに適切な名前を付けることで、Nginxをだまして、1つの完全に空のファイルが画像であり、もう1つのファイルがスタイルシートであると思わせることができます。

この構成では、Nginxは非常に小さなファイルを圧縮しないため、正確に1キロバイトのサイズのテストファイルを作成します。 これにより、Nginxが必要な場所で圧縮を使用しているかどうかを確認でき、あるタイプのファイルを圧縮し、他のタイプのファイルでは圧縮しません。

名前の付いた1キロバイトのファイルを作成します test.html デフォルトのNginxディレクトリで truncate. 拡張子は、それがHTMLページであることを示します。

  1. sudo truncate -s 1k /usr/share/nginx/html/test.html

同じ方法でさらにいくつかのテストファイルを作成しましょう:1つ jpg 画像ファイル、1つ css スタイルシート、および1つ js JavaScriptファイル。

  1. sudo truncate -s 1k /usr/share/nginx/html/test.jpg
  2. sudo truncate -s 1k /usr/share/nginx/html/test.css
  3. sudo truncate -s 1k /usr/share/nginx/html/test.js

ステップ2—デフォルトの動作を確認する

次のステップは、作成したばかりのファイルを使用して、新規インストールでの圧縮に関してNginxがどのように動作するかを確認することです。

名前の付いたHTMLファイルかどうかを確認しましょう test.html 圧縮で提供されます。 このコマンドは、Nginxサーバーからファイルを要求し、提供しても問題がないことを指定します gzip HTTPヘッダーを使用して圧縮されたコンテンツ(Accept-Encoding: gzip).

  1. curl -H "Accept-Encoding: gzip" -I http://localhost/test.html

応答として、いくつかのHTTP応答ヘッダーが表示されます。

Nginx応答ヘッダー
HTTP/1.1 200 OK
Server: nginx/1.6.3
Date: Fri, 11 Mar 2016 12:53:06 GMT
Content-Type: text/html
Content-Length: 1024
Last-Modified: Fri, 11 Mar 2016 12:48:02 GMT
Connection: keep-alive
ETag: "56e2be82-400"
Accept-Ranges: bytes

応答では、の言及はありません gzip なんでも。 これは私たちにそれを伝えます gzip サーバーで圧縮が有効になっていません。 これは、CentOS7でのサポートが原因です。 gzip デフォルトのNginx構成では完全に無効になっています。 圧縮が有効になっている場合、出力に次のような追加のヘッダーが表示されます Content-Encoding: gzip.

HTMLページだけでなく、新規インストール上の他のすべてのファイルも非圧縮で提供されます。 それを確認するために、という名前のテスト画像をリクエストできます test.jpg 同じやり方で。

  1. curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg

結果は、以前と実質的に同じになるはずです。

Nginx応答ヘッダー
HTTP/1.1 200 OK
Server: nginx/1.6.3
Date: Fri, 11 Mar 2016 12:58:03 GMT
Content-Type: image/jpeg
Content-Length: 1024
Last-Modified: Fri, 11 Mar 2016 12:48:05 GMT
Connection: keep-alive
ETag: "56e2be85-400"
Accept-Ranges: bytes

ありません Content-Encoding: gzip 出力のヘッダー。これは、ファイルが圧縮なしで提供されたことを意味します。

テストCSSスタイルシートを使用してテストを繰り返すことができます。

  1. curl -H "Accept-Encoding: gzip" -I http://localhost/test.css

繰り返しになりますが、出力には圧縮についての言及はありません。

CSSファイルのNginx応答ヘッダー
HTTP/1.1 200 OK
Server: nginx/1.6.3
Date: Fri, 11 Mar 2016 12:59:04 GMT
Content-Type: text/css
Content-Length: 1024
Last-Modified: Fri, 11 Mar 2016 12:48:05 GMT
Connection: keep-alive
ETag: "56e2be85-400"
Accept-Ranges: bytes

ステップ3—Nginxのgzipモジュールを有効にして構成する

次のステップは、圧縮の恩恵を受けることができるすべてのファイル形式の圧縮を有効にするようにNginxを構成することです。

The gzip moduleはNginxのコアモジュールです。つまり、すでにインストールされていますが、有効にして構成する必要があります。 CentOS 7へのNginxの新規インストールでは、 .conf からの拡張 /etc/nginx/conf.d ディレクトリは自動的にロードされます。 これにより、追加のモジュールを簡単に構成できます。

Nginxを有効にするには gzip モジュール、という名前の構成ファイルを作成します gzip.conf を使用して nano またはお気に入りのテキストエディタ。

  1. sudo nano /etc/nginx/conf.d/gzip.conf

以下の内容を貼り付けてください。

/etc/nginx/conf.d/gzip.conf
##
# `gzip` Settings
#
#
gzip on;
gzip_disable "msie6";

gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
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/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml image/x-icon;

ファイルを保存して閉じ、終了します。

ここで適用される構成設定を見ていきましょう。

  • gzip on ディレクティブはGzip圧縮を有効にします。

  • gzip_disable "msie6" IE6はサポートしていないため、圧縮ファイルを受信するブラウザーからInternetExplorer6を除外します。 gzip まったく。

  • gzip_varygzip_proxied 設定により、ブラウザとサーバー間のプロキシサーバーが圧縮を正しく認識できるようになります。

  • gzip_comp_level 6 圧縮するファイルの量を設定します。 数値が大きいほど、圧縮レベルとリソース使用量が高くなります。 6は妥当な中間点です。

  • gzip_http_version 1.1 制限するために使用されます gzip HTTP/1.1プロトコルをサポートするブラウザへの圧縮。 ブラウザがサポートしていない場合は、サポートされていない可能性があります gzip また。

  • gzip_min_length 256 256バイト未満のファイルを圧縮しないようにNginxに指示します。 非常に小さなファイルは、圧縮の恩恵をほとんど受けません。

  • gzip_types 圧縮されるすべてのMIMEタイプを一覧表示します。 この場合、リストにはHTMLページ、CSSスタイルシート、JavascriptおよびJSONファイル、XMLファイル、アイコン、SVG画像、およびWebフォントが含まれます。

新しい構成を有効にするには、Nginxを再起動します。

  1. sudo systemctl restart nginx

ステップ4—新しい構成を確認する

次のステップは、構成への変更が期待どおりに機能したかどうかを確認することです。

手順2で行ったのと同じように、次を使用してこれをテストできます。 curl 各テストファイルで、出力を調べます。 Content-Encoding: gzip ヘッダ。

  1. curl -H "Accept-Encoding: gzip" -I http://localhost/test.html

それに応じて、あなたは見るべきです Content-Encoding: gzip 以前はなかったヘッダー:

Nginx応答ヘッダー
HTTP/1.1 200 OK
Server: nginx/1.6.3
Date: Fri, 11 Mar 2016 13:19:16 GMT
Content-Type: text/html
Last-Modified: Fri, 11 Mar 2016 12:48:02 GMT
Connection: keep-alive
Vary: Accept-Encoding
Content-Encoding: gzip

他のすべてのファイルも同じ方法でテストできます。

  1. curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg
  2. curl -H "Accept-Encoding: gzip" -I http://localhost/test.css
  3. curl -H "Accept-Encoding: gzip" -I http://localhost/test.js

今だけ test.jpg画像ファイルである、は非圧縮のままにしておく必要があります。 他の両方の例では、見つけることができるはずです Content-Encoding: gzip 出力のヘッダー。

その場合は、構成済みです gzip Nginxでの圧縮に成功しました!

結論

完全に使用するためにNginx構成を変更する gzip 圧縮は簡単ですが、そのメリットは計り知れません。 帯域幅が限られている訪問者はサイトをより速く受け取るだけでなく、Googleはサイトの読み込みがより速くなることを喜んでいます。 速度は、現代のWebの重要な部分として注目を集めており、 gzip それを改善するための1つの大きなステップです。