【Azure】ストレージBlobで静的Webサイトを作成する(SSL独自ドメインの場合)

前回(ヨコヤマ企画: 【Azure】ストレージBlobで静的Webサイトを作成する(非SSL独自ドメインの場合))は、ストレージBlobの機能を使って静的Webサイトを構成しました。

• Azure標準ドメイン(SSL/非SSL可)
• https://noellil20230315.z11.web.core.windows.net/
• https://noellil202303152.z11.web.core.windows.net/
• 独自ドメイン(非SSLのみ)
• http://noellil20230315.nwtraders.net/
• http://noellil20230315-2.nwtraders.net/

用意した写真は、アイドルユニット「NoelliL(ノエリル)」が、2023年3月15日に川崎クラブチッタで行なったライブの様子です。

ストレージBlobの機能だけでは、独自ドメインを使った場合はSSLに対応できません。そこで、今回は、CDN(Content Delivery Network)を使ってSSL対応する方法を紹介します。

CDNの提供者は、高速なネットワークとストレージを備えたデータセンターを世界各地に持っています。画像や動画データを、CDNサイトに一時的に保存する(キャッシュする)ことで、応答性を高めるのがCDNの大事な役割です。また、多くの場合はSSL通信に必要な証明書を割り当てる仕組みも備えています。

▲CDNの利用

今回は、それほど多くのアクセスも、世界中に分散したクライアントも想定していませんが、SSL化するためにCDNを利用します。

Azure上で提供されるCDNは複数ありますが、今回はVerizon社がAzure上で展開しているサービス(Verizon Standard)を使いました。この場合の費用は、最初の10TBまでは1GBあたり約18円です。AzureからCDNへの通信料金はかかりませんが、CDNに無料枠はないのでCDNを使わない場合と比べて、若干のコストが追加されます。

なお、ストレージアカウントからCDNにコピーするためのネットワーク帯域には課金されません。

それでは構成してみましょう。前回の続きで、2つのサイトを構成します。

 

Step 1: CDNプロファイルとエンドポイントの作成

最初に、Azureから「Front DoorとCDN プロファイル」の管理ツールを開き、新規作成します。今回は、[その他のオファリングの探索]から[Azure CDN Standard from Verizon]を選択しました。

CDNは、すでにAzureのデータセンターまたはAzureと契約したCDNベンダーのデータセンターに展開されているため、「構築」の必要はありません。作業としては新規作成と同じですが、実際には「プロファイル(構成情報)」が定義されるだけなので、管理ツールには「CDNのプロファイル」と表示されます。

CDNプロファイルを作成するとき、同時に「エンドポイント」も指定できます(あとから追加することもできます)。エンドポイントは、キャッシュするWebサイトの代わりに指定するURLです。

▲CDNプロファイルとエンドポイントの作成

ここでは[新しいCDNエンドポイントを作成する]をチェックして、エンドポイントも同時に作成しました。画面ではnoellil20230315-2となっています。これにAzur CDNのDNSサフィックスであるazureedge.netを追加して http://noellil20230315-2.azureedge.net/ ができました。同様にもう1つのサイトも構成し、最終的に以下の2つのサイトを作成しました。

• http://noellil20230315.azureedge.net/
• http://noellil20230315-2.azureedge.net/

エンドポイントを作成するときは、元となるデータ(ソース)の場所と種類を指定します。今回はAzureストレージBlobの静的Webサイトを使うので[ストレージの静的Webサイト]を選びました。

しばらく待つとエンドポイントが構築されます。

▲作成されたエンドポイント

この状態で、初回アクセスは大元のストレージBlobから情報を取得するようになるのですが、少々時間がかかるようです。アクセスしても、しばらくは以下のような状態が続きます。

▲エンドポイント作成直後(まだコンテンツが複製されていない)

しばらく待つとCDNにファイルが複製されます。エンドポイントにアクセスすると目的の画像が表示されるはずです。

1つのCDNプロファイルで、複数のエンドポイントを作成できます。CDNプロファイル作成後に、エンドポイントを追加してください。今回は、2つのWebサイトを作成したので、エンドポイントも2つ用意しました。

 

Step 2: カスタムドメインの追加

このままではAzure CDNのDNSドメインサフィックスが使われてしまうので、カスタムドメインを追加します。

前回は、ストレージBlobにカスタムドメインを割り当てたのですが、その設定(DNSのCNAMEレコード)は削除してください。同じ名前を、今度はCDNに割り当てます。

• 登録するカスタムドメイン名: noellil20230315.nwtraders.net
• Azure CDNのドメイン名:  noellil20230315.azureedge.net

Webサイトを2つ作っているので、同様にもう1つのサイトのDNS名も割り当てます。

• 登録するカスタムドメイン名: noellil20230315-2.nwtraders.net
• Azure CDNのドメイン名:  noellil202303152.azureedge.net

DNSへの登録が完了したら、Azure CDNの[エンドポイント]の管理画面で、カスタムドメインを追加します。

 

Step 3: SSL用証明書(マネージド証明書)の割り当て

最後に、CDNにSSL用証明書を追加します。証明書は自分で作成したものを持ち込むこともできますが、Azure CDNから作成することもできます。Azure CDNで作成した証明書は「マネージド証明書」と呼ばれ、有効期間が来た場合の更新など、管理作業をすべてAzureが代行してくれます。しかも、料金はかかりません。

「厳密な審査を経た証明書を使いたい」といった要望でもない限り、ほとんどの場合はこれで十分でしょう。

 作成したカスタムドメイン名をクリックすると、SSLの構成画面に切り替わります。ここで[カスタムドメインHTTPS]を[オン]にし、[CDNマネージド]を選択して、[保存]をクリックします。

▲マネージド証明書の作成

その後の処理はすべて自動的に進行します。完了するまでは6時間ほどかかるので、気長に待っていてください。Azureの管理ツールを終了しても問題ありません。バックグラウンドで処理は継続します。

▲マネージド証明書の作成(約6時間かかる)

処理が完了しても、実際に有効になるまではさらに時間がかかります。以下は、構成が完全に完了する前にアクセスし、証明書情報を表示した例です。

▲マネージド証明書が完全に構成される前にアクセスした場合

以上で、Azure CDNを使ったSSL化が完了し、以下のサイトができました。

• http://noellil20230315.nwtraders.net/
• http://noellil20230315-2.nwtraders.net/

写真はアイドルグループ「NoelliL(ノエリル)」