はじめに
前回の記事で、Azure Storageで静的Webサイトで独自ドメインを利用する方法のうち、標準機能で実装できるHTTPについて試しました。
本記事では、標準機能だけではできない、独自ドメインでHTTPSを利用する方法について、挑戦してみたいと思います。
おさらい：HTTPかHTTPSか
Azure Storageで静的Webサイトを利用する際、HTTPかHTTPSか、によって実装方法が異なります。
カスタム ドメインを静的 Web サイトの URL にマップする
- HTTP（前回の記事で実施）
- Azure Stogrageでネイティブにサポートしている
- HTTPS（今回の記事で挑戦）
- Azure Stogrageではネイティブにサポートしていない
- Azure CDNを利用する
本記事で挑戦するのは、HTTPSを使った独自ドメインの利用となります。
なお、クリーンな環境で実施するため、前回とは別のストレージアカウントを作成し、静的Webサイトを有効にした上で進めています。
独自ドメインを Azure Storageの静的Webサイトに紐づける（HTTPS）
静的Webサイトのエンドポイントの値を確認
まず、Azure Storageの静的Webサイトとして利用しているエンドポイントの値を確認し、控えておきます。
ストレージアカウントからAzure CDNを設定する（エラー）
こちらの記事に準拠して進めるつもりだったのですが…
手順通りにストレージアカウントの「セキュリティとネットワーク」>「Azure CDN」を開き、「作成」をクリックして進めようとするとエラーになってしまいます。
よって、ここから先は、試行錯誤で進めてみます。
Azure Front Doorの作成
Marketplaceから「Front Door and CDN profiles」を選び、作成します。
今回はAzure Front Doorの簡易作成で進めます。
エンドポイントの設定を以下の通り行います。
- 配信元の種類
- ストレージ（静的Webサイト）
- 配信元のホスト名
- 先ほど確認した、静的Webサイトのエンドポイントの値を選択
このままAzure Front Doorを作成します。
Azure Front Doorの動作確認
この設定により、Azure Front Door経由でAzure Storageの静的Webサイトにアクセスできるはずなので、アクセスしてみます。
無事アクセスできました。
Azure Front Doorへの独自ドメインの設定
続いて、Azure Front Doorに独自ドメインを追加します。
Front Doorの「設定」>「ドメイン」から、「追加」をクリックします。
今回は、Azure DNS上でドメインを管理しているので、直接新しい名前をここで追加することにしました。
追加自体は成功しますが、これだけでは設定できないようです。
次の二つが必要そうなので、順にみていきましょう。
- エンドポイントの関連付け
- ドメインの検証
エンドポイントの関連付け
先ほどのドメイン追加後の画面で「関連付けなし」になっている箇所をクリックします。
今回は、エンドポイントもルートも一つしかないので、そのまま選んで関連付けます。
これでエンドポイントは設定出来ました。
DNSの設定、確認
Azure DNSを確認します。
てっきり、web2というレコードを作ってくれるのかと思ったのですが、違うようです。
Azure Front Doorに戻り、設定を確認します。
「保留中」の部分をクリックすると
検証用のTXTレコード情報が表示されます。Azure DNSの場合、ここで「追加」を押せばTXTレコードは作ってくれるようなので、実行してみます。
DNSレコードの状態は正しく認識されたようです。
Azure DNS側でも、TXTレコードが出来ている事が確認出来ました。
ただ、CNAMEレコードはやっぱりありません。そのため、手動で作ることにします。
もう一度Azure Front Doorに戻り、保留中の部分がどうなったか確認します。
承認済みに変わりました。
試行錯誤であちこちしてしまいましたが、以下の順で進めればよさそうです。
- DNSでCNAMEの追加
- Front Doorでドメイン追加
- Front DoorからTXTレコード追加
動作確認
いよいよ、独自ドメインを使ってHTTPSでアクセスします。
無事、独自ドメインを使って、Azure Storageの静的WebサイトにHTTPSを使ってアクセスする事が出来ました。
おわりに
本来設定出来そうなストレージアカウントのAzure CDNの画面から設定できなかったので思ったより苦労しました。
半面、Azure Front Doorでの設定はそこまで難しくはなかったので、一度やれば二度目はスムーズに出来そうです。
とはいえ、単純に独自ドメインにHTTPSでアクセスさせたいだけならAzure Web Appsの方が楽なので、ストレージアカウントの静的Webサイトを使うケースはかなり限定されるのではないかと思います。
Azure Storageの静的Webサイトに関してはいったんここまでとなります。参考になれば幸いです。
舟越 匠（日本ビジネスシステムズ株式会社）
人材開発部に所属。社内向けの技術研修をメインにしつつ、JBS Tech BlogやMS認定資格取得の推進役もやっています。資格としてはAzure Solutions Architect Expertを所持。好きなサービスはPower Automate / Logic Apps。好きなアーティストはZABADAK。
担当記事一覧