Azureで独自ドメインのhttps証明書付静的ホスティングやってみた。

- 2月 29, 2020

静的サイトホスティングシリーズもこれで最後です。
AWS、GCP(FireBase)ときて最後がAzureです。AWS、GCPは結構敷居が低いので触りやすかったんですが。最後まで敷居が高いなぁと思っていたのがAzure。結果として思い込みだけというのがあるのでしょうけど。どうもオンプレ時代のSPLAとかライセンス関連の料金体系が複雑だったのでAzureも一緒だと思って、これまで手を出せていませんでした。(2019年にAzure自体は登録したけど無料枠は失効しています。)
で、なぜ今さらAzureなのかというとIgniteTourでAzure系資格の無料受験特典をいただいたのでAZ-203を受けてみようと思って触り始めた次第です。ちなみにこれだという日本語テキストは2020年1月現在存在しないので(入門のAZ-900では存在)、MicrosoftAzureのラーニングパスでお勉強するしかないようです。今回やった静的サイトホスティングはどちらかというとAWSの構成に近いようなイメージでした。ドメインを追加購入するお金がないので、GCPの時と同じくサブドメインを設定して作業します。それではレッツトライ

◆手順

1.AzureDNSでサブドメイン設定

1)Azureポータルにログインしてトップの検索ボックスで「DNS」と入力し検索

2)DNSゾーンを作成するので[DNSゾーン作成]ボタンをクリック

3)リソースグループを作成してインスタンスを作成する。
・リソースグループで[新規作成]をクリックする。

・[名前]にリソースグループとして付ける名前を入力し[OK]をクリック

・[インスタンスの詳細]を入力する。[名前]には任意の名称、[リソースグループの場所]は[東日本]を選択する。過不足ないことを確認し[確認および作成]をクリック

・「検証に成功しました」と表示されるので[作成]をクリックする。

・デプロイ作業が行われる。デプロイ作業が完了すると完了表示がされるので
[リソースに移動]をクリック

4)NSレコードの登録
・AzureDNSの設定画面でNSの値の箇所をコピーする。

・AWSコンソールでRoute53の設定画面を開いて[レコードセットの作成]をクリック
＊当方ではRoute53に主ドメインを登録しているのでRoute53に登録する。

・[名前]にサブドメイン名、[タイプ]で[NS]を選択し[値]にAzureDNSでコピーしたNSの値を貼り付ける。過不足ないことを確認して[作成]をクリック

2.AzureStorageで静的ホスティング設定

1)リソースグループにストレージを追加
・[ホーム]をクリックしてAzureの管理ポータルのトップ画面に戻り[リソースグループ]をクリックする。

・リソースグループ名をクリックする

・[追加]をクリック

・[ストレージ]をクリックし[ストレージアカウント]をクリックする。

2)静的サイトホスティング設定
・必要項目を設定
[ストレージアカウント]に任意の名前を設定、[場所]は[(アジア太平洋)東日本]を選択
[アカウントの種類]は[StorageV2]を選択、[レプリケーション]は[geoゾーン冗長ストレージ]を選択する。[アクセス層]は今回は[クール]を選択する。過不足ないことを確認し、[確認および作成]をクリック

・検証に成功したことを確認し[作成]をクリック

・デプロイ完了表示となったら[リソースに移動]をクリックする。

・[静的なWebサイト]をクリックし[有効]を選択する。

・[インデックスドキュメント名]と[エラードキュメントのパス]を入力して[保存]を
クリック

・[プライマリエンドポイント]はどこかにコピーして控えておく

・[Storage Explorer]を選択し、[BLOBコンテナー]→[$web]を選択する。
[アップロード]をクリックし、ファイル選択ダイアログからアップロード対象ファイルを選択する。

・Filesを確認し[アップロード]をクリックする。

3.AzureCDNを設定

1)AzureCDN設定
・左サイドバーの[AzureCDN]を選択する。CDNのプロファイルの箇所を入力
[配信元のホスト名]は「プライマリエンドポイント」のhttpsより後ろを入力する。
入力に過不足がないことを確認して[作成]をクリック
＊作成後の動きに癖があったので少し悩むことあり。

・しばらく待って確認メッセージが表示されたら画面を更新すると「実行中」となるので[ホスト名]をクリックする。

・[エンドポイントのホスト名]をクリックする。

・[エンドポイントのホスト名]をコピーしておく、もう1つ別タブで管理コンソールを開く

2)カスタムドメイン設定
・ホーム画面で[DNSゾーン]をクリックする。

・ドメイン名をクリックする。

・[レコードセット]をクリックする。

・必要項目を設定する。
[名前]に「@」を入力し[種類]で[A]を選択、[エイリアスのレコードセット]で[はい]を選択する。[エイリアスの種類]で[Azureリソース]を選択する。[Azureリソース]では追加したCDNのリソース名を選ぶ。[TTL]は[1分]で設定して[OK]をクリック

・CDNの画面に戻り[カスタムホスト名]の箇所にドメイン名を入力し[追加]をクリック

・「カスタムドメイン作成された」メッセージが表示されるので[ホスト名]をクリック

3)SSL証明書設定

・[カスタムドメインHTTPS]は[オンに設定]、[証明書の管理の種類]は[CDNマネージド]を選択する。その後で[保存]をクリック

・保存が完了するとその後のプロセスが表示される。

＊ドメインの検証にかなりの時間が必要なので注意(即時反映ではない。)

・サブドメインでもメインドメインの管理者宛にメールが送信されてくるのでメール内のリンクをクリックして画面にてリンク先で[Approve]をクリック。

＊自分はAWSのSESを使用していたのでS3に届いたMailBoxで該当のメールを探した。

(AWSの場合はドメインにCNAMEあれば自動だがAzureはメール必須なので注意)

・承認完了画面となるので暫く待つ

・3時間ほどで証明書デプロイが完了するので、ステータスを確認する。

・補足：httpをhttpsにリダイレクトする
CDNのエンドポイントを選択し、そこから[ルールエンジン]を選ぶ
　[規則の追加]をクリックして[名前]を入力する。
　「要求プロトコル」を選んで「演算子」に[次の値に等しい]を選び
　「値」で[http]を選択する。
　「結果」の箇所で「型」にて[Moved(301)]を選択して「プロトコル」にて
　[https]を設定する。

サブドメインの場合はメインのドメインの管理者あてにメールが来るというのが落とし穴でした。メールで承認作業さえしてしまえば、その後は反映まではそんなに遅くなかったです。
AWSと違って証明書反映までの時間が数時間単位でかかるので即時デプロイというのは難しいかもしれませんが、https付証明書の静的サイトホスティングの選択肢としては十分にありではないかと感じました。コスト面でもおそらくAWSの構成と変わらないようです。

◆参考サイト

このブログを検索

アラフィフおやじログ