とある櫻花の一方通行~ウェブアクセラレータでHTTP/2を使おう~

こんにちは、さくらインターネット クラウドチームの大喜多です。

オープンβテスト中の「ウェブアクセラレータ」にHTTP/2に対応可能であることをご存知でしたでしょうか。今回はその手順についてご説明致します。

※「ウェブアクセラレータ」のサービス概要については以下の記事もご参照ください。
コンテンツ配信サービス THE ORIGIN ~さくらの新サービス「ウェブアクセラレータ」を使ってみよう~
ウェブアクセラレータ - さくらのクラウドニュース

ウェブアクセラレータの使い方

前回の記事コンテンツ配信サービス THE ORIGIN ~さくらの新サービス「ウェブアクセラレータ」を使ってみよう~のおさらいになりますが、あらためてウェブアクセラレータの2つの方式についてご説明します。

独自ドメイン方式

ウェブアクセラレータにオリジンサーバのIPアドレスを登録すると、一意のFQDNが発行されます。CNAMEレコードを作成し値にFQDNを登録します。CNAMEレコードのホスト名に対するWebアクセスがウェブアクセラレータ経由になります。前回はこちらの方式の利用手順をご説明しました。
domain

サブドメイン方式

ウェブアクセラレータにオリジンサーバのIPアドレスを登録すると、一意のFQDNが発行されます。ここまでは独自ドメイン方式と同じですが、オリジンサーバのWebコンテンツを書き換える必要があります。画像ファイル等のキャッシュ対象のファイルはウェブアクセラレータのFQDNに直接アクセスするためHTTPSが利用可能になり、HTTP/2の恩恵が受けられるのもこの方式のときです。今回はこちらの方式の利用手順についてご説明します。
subdomain

サブドメイン方式の設定方法

オリジンサーバでコンテンツキャッシュを有効にする

Cache-Controlヘッダでキャッシュ時間を設定する場合に、s-maxageを使用します。Apacheの場合、httpd.conf や .htaccess などで、以下のように設定します。

<Files ~ ".(gif|jpe?g|png|ico)$" >
 Header set Cache-Control "s-maxage=86400, public"
 </Files>

ウェブアクセラレータにサイトを作成する

ログイン画面にてさくらのクラウドユーザとしてログインします。ログイン情報を入力し「ログイン」ボタンをクリックします。
cloud-login

さくらのクラウド ホーム画面で「ウェブアクセラレータ」のアイコンをクリックします。
cloud-home

さくらのクラウド ウェブアクセラレータのダッシュボードが表示されます。
saku01

左メニューの「サイト一覧」をクリックし、右側の「追加」ボタンをクリックします。
saku02

「サイト新規追加」画面で、名前(ウェブアクセラレータの画面で管理するための名前)・オリジンサーバのグローバルIPアドレスを入力し、「追加」ボタンをクリックします。
saku21

「追加確認」画面で内容を確認し、「追加する」ボタンをクリックします。
saku22

「有効化」ボタンをクリックします。
saku23

「有効化確認」画面で内容を確認し、「有効化する」ボタンをクリックします。
saku24

以下のようにステータスが「有効」となっていれば、ウェブアクセラレータ上での設定作業は完了です。
saku25

ウェブコンテンツの修正

サブドメイン方式ではウェブアクセラレータのキャッシュサーバがオリジンサーバから画像を取得し表示します。そのためウェブコンテンツの画像参照している部分のHTML文を以下の通り修正します。

修正前:オリジンサーバのIPアドレスまたはFQDNを使った絶対パスで指定する

<IMG SRC="http://203.0.113.80/image/01.jpg" BORDER="0" WIDTH="1280" HEIGHT="960" ALT="01.jpg">

修正後:ウェブアクセラレータのサブドメインを使った絶対パスで指定する

<IMG SRC="https://00000000.user.webaccel.jp/image/01.jpg" BORDER="0" WIDTH="1280" HEIGHT="960" ALT="01.jpg">

※修正前に画像の場所を相対パスで指定している場合は、絶対パスに書き換える必要があります。

このようにウェブコンテンツの画像参照パスを変更することで、ユーザがWebサイトにアクセスした際の、画像等のキャッシュ対象コンテンツに対するアクセスは、全てウェブアクセラレータのキャッシュサーバに対して行われるようになります。(オリジンサーバへのリクエストはキャッシュサーバからのみとなります)

ユーザからのキャッシュ対象のコンテンツへのアクセスはウェブアクセラレータのFQDNに対して行われるため、HTTPSの処理はウェブアクセラレータのキャッシュサーバが行います。ウェブアクセラレータのキャッシュサーバはHTTP/2にも対応していますので、HTML構文に最適化された配信が行われます。

動作確認

ウェブコンテンツの修正が完了した後に、Webブラウザで正しく表示されるか確認します。
saku17

さくらのクラウド ウェブアクセラレータの「ダッシュボード」画面で、状況がグラフで確認できます。
saku26

いかがでしたでしょうか。βテスト期間中は無料でご利用いただけますので、ぜひこの機会に試してみてください。

また、重ねてのご案内となりますが、ウェブアクセラレータの詳細はマニュアルページ「ウェブアクセラレータ」も併せてご確認ください。