Nodachisoft Nodachi Sword Icon
  
@あまじ✎ 2021年8月12日に更新

nginxでHTTP2を使うメリットとデメリット

概要

今まで nginx で HTTP/1.1 を使っていましたが、 HTTP/2 を使うとコンテンツの転送速度やページを開くまでの速度が上がりそうなので、nginx の HTTP/2 設定を有効にしていきます。

その時の変更方法を備忘したものです。

環境は以下の通り。

ソフト
nginx 1.21.1
Amazon Linux 1

HTTP/2 有効化のまえに必要なこと

HTTP/2 を有効にするためには HTTPS のための証明書が必須となります。

インターネットに公開しない、LAN 環境で使用する場合は自己証明書でも OK です。 今回は当サイト(nodachisoft.com)などのインターネットに公開するサービスでの 使用を前提としていますので、Let's Encrypt などの無料サービスを使って 証明書を取得しています。

(Let's Encrypt サービスからの証明書取得の方法は割愛します。)

nginx.confファイル
    # nodachisoft.com
    server {
        listen       443 ssl;
        server_name  nodachisoft.com;

        ssl_certificate      /etc/letsencrypt/live/nodachisoft.com-0001/fullchain.pem;
        ssl_certificate_key  /etc/letsencrypt/live/nodachisoft.com-0001/privkey.pem;

        ssl_protocols        TLSv1 TLSv1.1 TLSv1.2;
        ssl_session_cache    shared:SSL:1m;
        ssl_session_timeout  5m;
        ssl_ciphers  HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers  on;

以下のように設定を変更します。

具体的には、listen ディレクティブに http2 を追加しています。

nginx.confファイル
    # nodachisoft.com
    server {
// highlight-next-line
        listen       443 ssl http2;
        server_name  nodachisoft.com;

        ssl_certificate      /etc/letsencrypt/live/nodachisoft.com-0001/fullchain.pem;
        ssl_certificate_key  /etc/letsencrypt/live/nodachisoft.com-0001/privkey.pem;

        ssl_protocols        TLSv1 TLSv1.1 TLSv1.2;
        ssl_session_cache    shared:SSL:1m;
        ssl_session_timeout  5m;
        ssl_ciphers  HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers  on;

nginx の設定を変更したら、設定ファイルの文法ミスがないことをnginx -t コマンドで確認してから再起動します。

文法ミスのチェック
> nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

syntax is ok とでており、問題なさそう。

serviceコマンドを使って、nginx を再起動します。

nginxの再起動
> service nginx restart
Stopping nginx:                                            [  OK  ]
Starting nginx:                                            [  OK  ]

OK と出ており、無事に停止+開始が完了したようです。

HTTP/2 通信ができているかの確認方法

Edge や Chrome など、ブラウザからサイトにアクセスしただけでは、 HTTP/2 接続なのか、HTTP/1.1 接続なのかはわからないため、

Chrome のデバッグモードなどで確認します。

Chrome のデバッグモードを開く

確認したい対象のサイトにアクセスしたら、 Ctrl + Shift + i 、もしくは、ブラウザのデベロッパーモードを開きます。

Google Chrome のデベロッパーモードを開く Google Chrome のデベロッパーモードを開く

デベロッパーモードが開いたら、ネットワークのタブをクリックします。

network を確認 Google Chrome のデベロッパーモードでネットワークを確認

この状態で、確認したいサイトを再読み込みします。

サーバからダウンロードしたファイルの一覧が表示されたら、どのプロトコルを使って データを転送したのかを表示できるように設定を変更します。

Google Chrome

転送したファイルのいずれかを右クリックHeaders Optionsprotocolを選択してチェックを入れる。

これでプロトコルが表示されるようになります。

HTTP/1.1 から HTTP2 への切り替え

今まで http/1.1 と表示されていたプロトコルが h2 となっていれば、問題なく HTTP/2 over TLS の通信ができています。

※Google の javascript などは h3(HTTP3)で表示されています。

HTTP2.0 のざっくり特徴とメリット・デメリット

nginx 公式ブログでも書かれていましたが、 HTTP/2.0 は HTTP/1.x と比べて単純にメリットだけでなく、デメリットもあります。

大量のファイルをダウンロードするときなど、転送速度にメリットがある場合も多いですが、 他のプロトコルのほうが転送が早いという場合もあります。

特徴

バイナリ通信へ

HTTP/2.0 となると、 通信が平文(単純に通信をのぞくとテキスト形式で転送されている)から、バイナリデータに変更されます。

バイナリベースでの通信で、HTTP/1.X とは互換性がないため、HTTP/2.0 とメジャーバージョンアップした表記となっているようです。

バイナリファイルをバイナリのまま転送できるため、

バイナリデータなので、単純に通信パケットのみをのぞいても、通信内容を読み取りづらいというデメリットがあります。

1つのコネクションでデータ転送

多重化(multiplexing)と呼ばれる仕組みで、 複数のリクエストを一つのコネクションでやり取りできるようになります。 HTTP/1.1 ではリクエスト毎にデータ通信のためのストリームを分ける必要がありました。

この仕組みは、複数のデータ(ファイル)を転送する時には、高速化に繋がることが多くメリットがあります。

ただし、でかい一つのファイルやYoutube などの動画データを受信する場合には、 一つのリクエストを処理するのが主な処理となるため、HTTP/2 の仕組み上 オーバーヘッドがかかりデメリットとなる場合があります。

HTTP HEADERの圧縮

HTTP/2.0 でHTTP通信を行う時、リクエストに含まれる COOKIE などのヘッダ情報は圧縮されます。 今まで HTTP/1.x の世界では複数のリクエストに毎回、同じようなヘッダ情報を付けていましたが、 一つのコネクションでデータ転送できるようになったため、 リクエストのヘッダ部分で重複する項目を効率圧縮する(HPACK圧縮)ようになりました。

デメリットとしては、一連のデータ転送(リクエストたち)が完了するまで、 サーバ側もクライアント側も、どんなヘッダー値をやり取りしているのかを記憶しておかなければならなくなるため、 メモリ消費量が若干増えます。

転送するデータの優先度

HTTP/2.0 では一つのコネクションで複数のリクエストを処理しますので、 次にどのデータ(ファイル)を転送すべきか、優先度が計算されています。

HTTP/2.0 では優先度計算はオプションですが、nginx では完全に対応しているとのこと。(by nginx 公式ブログ)

参考

変更履歴

  • なし
 
 
送信しました!

コメント、ありがとうございます。

なんかエラーでした

ごめんなさい。エラーでうまく送信できませんでした。ご迷惑をおかけします。しばらくおいてから再度送信を試していただくか、以下から DM などでご連絡頂ければと思います。

Twitter:@NodachiSoft_jp
お名前:
 
連絡先:
 
メッセージ:
 
戻る
内容の確認!

以下の内容でコメントを送信します。よろしければ、「送信」を押してください。修正する場合は「戻る」を押してください

お名前:
 
連絡先:
 
メッセージ:
 
Roboto からの操作ではないという確認のため確認キーを入れてください。
確認キー=95
戻る
 / 
送信確認へ
コメント欄
コメント送信確認へ

目次
nginxでHTTP2を使うメリットとデメリット
nginxでHTTP2を使うメリットとデメリット
概要
概要
HTTP/2 有効化のまえに必要なこと
HTTP/2 有効化のまえに必要なこと
HTTP/2 通信ができているかの確認方法
HTTP/2 通信ができているかの確認方法
Chrome のデバッグモードを開く
Chrome のデバッグモードを開く
HTTP2.0 のざっくり特徴とメリット・デメリット
HTTP2.0 のざっくり特徴とメリット・デメリット
特徴
特徴
バイナリ通信へ
バイナリ通信へ
1つのコネクションでデータ転送
1つのコネクションでデータ転送
HTTP HEADERの圧縮
HTTP HEADERの圧縮
転送するデータの優先度
転送するデータの優先度
参考
参考
変更履歴
変更履歴
Nodachisoft © 2021