静的Webサイトホスティング二重化してみる(その2)

少し間が空いてしまいました。前回に引き続いて静的ホスティングサイトを二重化してみる編です。バックアップサイトをどうするか考えたときに、パッと出てきたのがそう、GoogleCloudです。以前にGoogleCloudで静的サイトホスティングをやったときは結局はFireBaseでやっちゃいましたが今回は冗長構成を取るという構成なのでFireBaseよりはGoogleCloud本体を使用した構成で考えています。下図の様な感じですね。ひとまずGoogleCloud側の作業に取り掛かります。ちなみにGoogleCloudは一部コマンドラインで設定とかあるんですが面倒なのですべてコマンドラインで操作しました。GUIでポチポチやってもいいんですが、どうしても一部コマンドラインが入るのでそれならということでコマンドラインでやりました。まぁほとんど参考サイトのコピペですけどね。









◆シリーズ

その1:AWSでCloudFront+S3構成を作る

その2:GoocleCloudでLoadBaranser+GCS構成を作りDNSでフェイルオーバ

その3:S3とGCSにGitHubActions使ってコンテンツ同期

その4:TerraformでIaC化


◆手順概要

1.事前準備

1-1.GoogleCloudプロジェクト関連設定

1-2.静的IPアドレス取得

1-3.GCP用のSSL証明書発行

2.GoogleCloud作業

2-1.CloudStorageでバケット作成・公開設定

2-2.LoadBarancingの設定

3.Route53のフェイルオーバ設定

3-1.Aレコードの削除

3-2.ヘルスチェックの作成

3-3.フェイルオーバーレコードの作成



1.事前準備

1-1.GoogleCloudプロジェクト関連設定

$ gcloud components update
$ gcloud config list
$ gcloud config set project create {project_name}
$ gcloud config set project {project_name}
$ gcloud config configurations activate {project_name}
$ gcloud config configurations list | grep True | awk '{print $1}'
$ gcloud config set compute/region asia-northeast1
$ gcloud config set compute/zone asia-northeast1-a
$ gcloud config configurations list
$ gcloud auth login
$ gcloud config set project PROJECT_ID
$ gcloud auth application-default login
$ gcloud --version
Google Cloud SDK 321.0.0
alpha 2020.12.11
app-engine-python 1.9.91
beta 2020.12.11
bq 2.0.64
cloud-datastore-emulator 2.1.0
core 2020.12.11
gsutil 4.57

1-2.静的IPアドレス取得

$ gcloud compute addresses create yoursite-ip \
    --network-tier=PREMIUM \
    --ip-version=IPV4 \
    --global
$ gcloud compute addresses describe yoursite-ip \
    --format="get(address)" \
    --global

1-3.GCP用のSSL証明書発行

・事前にRoute53のAレコードをGCPの静的IPアドレスに変更しておく

※ZoneApexだけでなくwww付きの方も設定する










・subという名前でロードバランサーのIPアドレスをサブドメイン登録しておく






・証明書発行

$ gcloud compute addresses create yoursite-ip \
    --network-tier=PREMIUM \
    --ip-version=IPV4 \
    --global
$ gcloud compute addresses describe yoursite-ip \
    --format="get(address)" \
    --global

※LBでの証明書登録完了まで30分程度はかかるので暫くこのままの設定としておく



2.GoogleCloud作業

2-1.CloudStorageでバケット作成・公開設定

・バケット作成とファイルの共有

$ gsutil mb -b on -l ASIA gs://yoursite
$ mkdir html
*htmlディレクトリにファイルをアップロード
$ gsutil rsync -R html gs://yoursite
$ gsutil iam ch allUsers:objectViewer gs://yoursite

・特殊ページ割当

$ gsutil web set -m index.html -e 404.html gs://yoursite
$ gsutil web get gs://yoursite


2-2.LoadBarancingの設定

・バックエンドバケット作成

$ gcloud compute backend-buckets create yoursite \
 --gcs-bucket-name=yoursite

・URL マップを構成する

$ gcloud compute url-maps create yoursite-lb \
    --default-backend-bucket=yoursite

・ターゲット プロキシを構成する

$ gcloud compute target-https-proxies create yoursite-lb-proxy \
    --ssl-certificates=yoursite \
    --url-map=yoursite-lb

・転送ルールを構成する

$ gcloud compute forwarding-rules create yoursite-lb-forwarding-rule \
    --global \
    --target-https-proxy=yoursite-lb-proxy \
    --address=yoursite-ip \
    --ports=443

・httpリダイレクト

$ mkdir settings
$ cd settings
$ vi siteredirect.yaml
------------------------------
kind: compute#urlMap
name: https-redirect
defaultUrlRedirect:
  redirectResponseCode: "MOVED_PERMANENTLY_DEFAULT"
  httpsRedirect: True
-----------------------------
$ gcloud compute url-maps import https-redirect \
  --source siteredirect.yaml \
  --global
$ gcloud compute target-http-proxies create http-lb-proxy \
  --url-map=https-redirect \
  --global
$ gcloud compute forwarding-rules create test-app-forwarding-rules \
  --target-http-proxy=http-lb-proxy \
  --address=yoursite-ip \
  --ports=80 \
  --global


3.Route53のフェイルオーバ設定

※GCP側の証明書設定が完了してから作業をする。

3-1.Aレコードの削除









3-2.ヘルスチェックの作成

・[ヘルスチェック]→[ヘルスチェックの作成]をクリック







・[名前]に任意の名称を入力し[プロトコル]で「https」を選択し[ドメイン名]には前回公開したCloudFrontのエイリアスを設定する。その後で「次へ」をクリック










・[アラームの作成]はそのままとしておき[ヘルスチェックの作成]をクリックする。







3-3.フェイルオーバーレコードの作成

・ホストゾーンで該当のドメインを選択して[レコードを作成]をクリック





※あらかじめ、CloudFront設定時に「main.ドメイン名」でAlternate Domain Names(CNAMEs)に登録しておく

・メインサイト用のCloudFrontのエイリアスAレコードを作成する。[レコード名]で先頭に「main」をつける[エイリアス]を有効にして[レコードタイプ]がAとなっていることを確認したうえで[トラフィックのルーティング先]で[CloudFrontディストリビューションのエイリアス]を選択する。CloudFrontのディストリビューションを選択して[レコードを作成]をクリックする。






・プライマリ側のAレコードを作成する。[ルーティングポリシー]で[フェイルオーバ]を選択する。[エイリアス]は有効にする。[トラフィックのルーティング先]で[このホストゾーンにある別レコードのエイリアス]であらかじめ先ほど設定した「main」のレコードを選択する。[フェイルオーバレコードタイプ]を[プライマリ]に設定する。[ヘルスチェック-オプション]は3-3で設定した名前のモノを選択する。[レコードID]は一意な名前になる様に適当に設定する。

※ZoneApexだけでなくwww付きの方も設定する







・セカンダリ側のAレコードを作成する。[ルーティングポリシー]で[フェイルオーバ]を選択する。[レコードタイプ]がAとなっていることを確認して「値」にロードバランサーのIPアドレスを入力する。[フェイルオーバレコードタイプ]を[セカンダリ]に設定する。[レコードID]は一意な名前になる様に適当に設定する。

※ZoneApexだけでなくwww付きの方も設定する







以上で作業完了です。DNSの反映が完了しているころ合いを見計らってCloudFrontで該当のディストリビューションを「disable」にすれば実際のフェイルオーバーを確認できます。DNSでの障害検知から切り替わるまでに5分ほどかかりますが、GCS側に切り替わってくれました。


◆感想

これでCloudFrontに障害が起きてもGoogleCloudで継続してサイトを動かせそうです。しかしながらLoadBarancerを利用しているのでコスト面で3,000円/月程度必要になってしまうのと証明書の更新について考慮が必要という点が問題となります。(GoogleCloud側がLet'sEncryptなので定期的に確認取れるようにしてやる必要あります。)

もしかしたらAzureの構成で冗長を考えたほうがコスト面では優位かもしれないです。これは今後の課題ということでいずれ手を着けてみたいです。


ちなみに商用でダウンタイムを少しでも小さくしたいとか考えるなら、今回の構成でかかるコストは痛くもかゆくもないと思うのですが、個人では少し切実です。商用の実運用時は証明書についてはおそらくどっかの商用SSLを購入されるかと思うのでワイルドカード証明書なり購入してAWSとGCPの両方に設定しておけばいいかなとは思います。

後はコンテンツの更新が課題です。Gitで更新したときに両方にコンテンツを反映する様な仕組みが必要です。こいつは次回で考えてみたいです。今年はこのブログが最後位かなぁ、、、なんとかコンテンツ更新の仕組みまでは頑張りたいところです。


◆参考サイト

・L7LB+GCSでの静的サイトホスティング

https://cloudpack.media/46063

https://devnob.com/archives/233

https://iga-ninja.hatenablog.com/entry/2019/02/16/152844

https://qiita.com/maejimayuto/items/adffbbd632d4aa179480

https://dev.classmethod.jp/articles/cloud-storage-spa-infrastructure/

https://cloud.google.com/storage/docs/hosting-static-website/?hl=ja

https://cloud.google.com/storage/docs/hosting-static-website/?hl=ja#gsutil

https://cloud.google.com/load-balancing/docs/https/ext-load-balancer-backend-buckets?hl=ja

https://medium.com/google-cloud/host-a-static-website-on-gcp-with-loadbalancer-and-cdn-e1ce71d38d07

https://www.fromcli.com/00009/

・単純な静的サイトホスティング

https://blog.apar.jp/web/7745/

・CloudFlare+GCS

https://www.serversus.work/topics/iw3bm5jvkomnd2hjbau2/

・gcloudプロジェクト切替

https://qiita.com/toshi0607/items/90cbbacdfae6c4282c0a

https://qiita.com/sonots/items/906798c408132e26b41c

・GoogleマネージドSSL

https://cloud.google.com/load-balancing/docs/ssl-certificates/troubleshooting?hl=ja&_ga=2.103383232.-1969018468.1591162716#domain-status

・GCP LBリダイレクト

https://inside.pixiv.blog/2020/05/08/161041

https://cloud.google.com/blog/ja/products/networking/how-to-use-new-traffic-control-features-in-cloud-load-balancing?fbclid=IwAR0mgtu24zluWVFUTwkSMR2uq42YofI3qR1rjkOyCf-pUjk-Vjryrhgcs1k

・LoadBarancer

コメント

このブログの人気の投稿

証券外務員1種勉強(計算式暗記用メモ)

GASでGoogleDriveのサブフォルダとファイル一覧を出力する

マクロ経済学(IS-LM分析)