【図解】Xserver(エックスサーバー)でHTTP/2に対応する方法

「公務員辞めました」でも利用中の、月額1,000円で運用できる「Xserver(エックスサーバー)」。2017年9月からXserverで対応を開始した「HTTP/2」を利用すれば、ページの表示速度を改善できるらしい…。

という訳でサーバーの移管作業に挑んだので、その経緯を報告したい。

ページの高速化には「HTTP/2」…?

「Parallelize downloads across hostnames」の項目は0点のままである。

Parallelize downloads across hostnamesのスコアが0点
これは、45の並列リクエストをkomuinresign.netに送っているから起こる問題らしい。具体的な原因の説明はこちらのブログが詳しい。

HTTP/1.1の場合1つのリクエストが完了するまで、原則次のリクエストを送ることができません。WEBサイトに画像が2個あった場合、初めのHTMLを読み込み1番目の画像を読み込み終わったら2番目の画像を読み込むといったイメージで大変非効率な通信となります。これらの制約を回避するために、ほとんどのモダンブラウザは1ドメイン=複数同時接続を行うことである程度通信の多重化を図っています。(中略)HTTP/2では1つの接続上にストリームと呼ばれる仮想的な双方向シーケンスを作ること(ストリームの多重化)で問題を克服しています。 – HTTP/2の特徴 HTTP/1.1との違いについて

という訳で、HTTP/2にすると高速化が可能なようだ。僕の使っているXserver(エックスサーバー)は2017年9月からHTTP/2の対応を開始している。じゃあ僕の環境は?ということでHTTP/2 Test | A simple HTTP/2.0 test toolで調べてみると、HTTP/2には対応していないとの表記が。

HTTP/2に未対応

実は、「nginx」導入!「HTTP/2」対応!Webサイト表示速度の大幅向上のお知らせ(2017/9/20 AM8:30更新) – 2017/09/14 | レンタルサーバー【エックスサーバー】によれば、利用しているサーバーによってHTTP/2の提供開始日が異なるのだ。

【sv3101.xserver.jp 以降のサーバー】
 2017年9月14日より、nginxおよびHTTP/2のご利用が可能です。
【sv2001.xserver.jp~sv3100.xserver.jp サーバー】
 2017年9月20日より、nginxおよびHTTP/2のご利用が可能です。
【sv1.xserver.jp~sv1999.xserver.jp サーバー】
 sv1.xserver.jp~sv1999.xserver.jp サーバーにつきましては、
 今後予定している最新サーバー環境への切り替えメンテナンスとともに
 nginx、HTTP/2が利用できるようになりますので、
 今しばらくお待ちくださいますようお願いいたします。

僕の利用しているサーバーは「sv1.xserver.jp〜sv1999.xserver.jp」の範囲にあるため、2017年12月22日現在で未だnginxとHTTP/2に対応していないと思われる。

幸い、Xserver側の対応を待たなくても、「新サーバー簡単移行」機能で最新サーバー環境への移行が可能なため、早速利用してみることにした。利用にあたり以下のページを大いに参考にさせていただいた。

データコピー

Xserverのインフォパネルにログインし、各種お申し込みの「新サーバー簡単移行」をクリック。

新サーバー簡単移行押下

ステータスが「移行可能」であることを確認し、「データコピー申請」をクリック。

データコピー申請をクリック
データのコピー申請が完了。データコピー完了の通知メールを待つ。申込状況やデータ使用量によっては数時間から最大24時間程度まで待つ必要があるらしい。僕の場合は、データコピー完了までに1時間ほどかかった。

データのコピー申請が完了

確認

しばらくすると、Xserverに登録のメールアドレスに「【Xserver】■重要■ [新サーバー簡単移行]データコピー完了のお知らせ」が届く。これは、旧サーバーのデータを新サーバーにコピーしたという内容だ。新サーバーにコピーしたデータは1週間後の12:00までが保存期限なので、それまでに移行作業を行う必要がある。

データコピー完了のお知らせ
hostsファイルを編集して、新サーバー移行後の稼働状況を閲覧できる。hostsはmacの場合、etc/hostsに入っている(隠しフォルダ?)。hostsファイルをデスクトップに移動させ、テキストエディタで開く。

hostsファイル

hostsファイル最下部に「サーバーIPアドレス + (半角スペース) + ご利用ドメイン名(もしくはサブドメイン)」と入力。

hostsファイルの入力例

  • ドメイン「example.com」の場合:xxx.xxx.xxx.xxx example.com
  • サブドメイン「test.example.com」の場合:xxx.xxx.xxx.xxx test.example.com

IPアドレスはインフォパネルから確認。「新サーバー簡単移行へ」ボタンをクリック。

「新サーバー簡単移行へ」ボタン

IPアドレスはインフォパネルから確認しよう!
Xserverの動作確認についてで「サーバーのIPアドレスは、サーバーパネル内の「サーバー情報」にて確認が可能です。」と書いてあるんだけど、いざページにアクセスすると「「新サーバー簡単移動」機能を利用中のため、サーバーパネルを利用できません。準備完了までしばらくお待ちください。」と表示されて見ることができない。そのため、インフォパネルから確認する必要がある。

「移行元・移行先への操作」をクリック。

移行元・移行先への操作

遷移先で移行先サーバーのIPアドレスが書かれているので、hostsファイルに入力。「/etc」のhostsファイルと置き換えよう。

ただし、hostsファイルを変更してもブラウザではすぐに反映されない。hostsファイルの変更をブラウザで即反映させる方法を参考にキャッシュ等をクリアにしよう。

下記画面で、[clear host cache]ボタンを押下
chrome://net-internals/#dns
下記画面で、[flush socket pools]ボタンを押下
chrome://net-internals/#sockets

もしもあなたがGoogle Chromeを使っているなら、デベロッパーツールでリモートIPアドレスが確認できる。「Network」→「該当のディレクトリ名」をクリックし、「Remort Address」の欄が新サーバーのIPアドレスかどうか確認しよう。

リモートIPアドレスの確認
IPアドレスに問題がなければ、サイトの動作がおかしくないか確認したい。

動作に特に問題がない場合、hostsファイルでの確認はここで終了となる。

次に、「データコピー実行ログ閲覧」でデータコピー時にエラーが出ていないか確認。特に問題なさそうだったので、サーバー切り替え作業に移行。

エラーログなし

移行

ひとつ画面を戻り、「サーバー切り替え」ボタンをクリック。

サーバー切り替えボタンをクリック
サーバー切り替え画面が表示されるので、最下部の「サーバー切り替え」を押下。

ページ最下部のサーバー切り替えボタン
以上でサーバー移行作業は終了だ。最後にあなたのWEBサイトのIPアドレスが無事切り替わっているかどうか確認しよう。

表示速度について

Website speed testで計測。performance gradeはほとんど変わっていないが、Load timeは少し早くなっただろうか?

Website speed testでのスコア計測結果
0点だった「Parallelize downloads across hostnames」がAの100点になったので、良しとしよう。

Parallelize downloads across hostnamesがAの100点
もしもあなたがXserver(エックスサーバー)を使っていて、HTTP/2に移行できていないのなら挑戦してみると良いかもしれない。

この記事をシェアしてみよう!



コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

ABOUTこの記事をかいた人

アバター

元公務員。「ゆるく生きたい…!」「夢がありそう…!」と希望を持って地方から上京したものの、東京の荒波に晒され地獄感を味わう。過労とストレスで体を壊すぐらいなら冷蔵庫を壊そう。