はじめに
ウェブサイトの移設等でドメインを変更する機会はよくあると思います。その際、いきなり旧ドメイン削除せず新ドメインにリダイレクトしたりしますよね?設定方法はいくつか考えられると思いますが、今回は AWS CloudFront+S3(静的ウェブサイトホスティング)を活用したリダイレクト設定方法を紹介します。
以前、同じような内容で AWS ELB リスナールールを活用したリダイレクト設定方法も紹介してますので、興味がある方はそちらもご覧ください。
techblog.cartaholdings.co.jp
構成イメージ
リダイレクト設定前
リダイレクト設定後
やりたいこと
現ドメイン | リダイレクト先ドメイン |
AAAAA.example.com | BBBBB.example.com |
1.https://AAAAA.example.com/backup/xxxxx へアクセスした場合 https://BBBBB.example.com/new/backup/xxxxx へリダイレクト
2.上記以外の https://AAAAA.example.com/ へアクセスした場合 https://BBBBB.example.com/ へリダイレクト
もう少し細かく説明すると
1は
パスが「/backup/」まで指定されたアクセスの場合
リダイレクトする際に「/new/」パスをドメインの後ろに追加し
既存パス「/backup/xxxxx/」は「/new/」パスの後に継承する設定
例えばこのようなリダイレクトです
https://AAAAA.example.com/backup/xxxxx ⇒ https://BBBBB.example.com/new/backup/xxxxx
2は
パスが「/backup/」以外でアクセスの場合
パスがそのまま継承されリダイレクトする設定
例えばこのようなリダイレクトです
https://AAAAA.example.com/ ⇒ https://BBBBB.example.com/
https://AAAAA.example.com/xxxxx ⇒ https://BBBBB.example.com/xxxxx
S3 設定(細かい作成項目は省略)
[サービス > S3 > バケット > 対象 バケット > プロパティ > 静的ウェブサイトホスティング]
[編集] を押下
静的ウェブサイトホスティング | 有効 |
スティングタイプ | 静的ウェブサイトをホストする |
インデックスドキュメント | index.html(なんでもOK) |
<リダイレクトルール >
[ { "Condition": { "KeyPrefixEquals": "backup/" }, "Redirect": { "HostName": "BBBBB.example.com", "HttpRedirectCode": "301", "Protocol": "https", "ReplaceKeyPrefixWith": "new/backup/" } }, { "Redirect": { "HostName": "BBBBB.example.com", "HttpRedirectCode": "301", "Protocol": "https" } } ]
[変更の保存] を押下
設定すると「バケットウェブサイトエンドポイント」が作成されます
「バケットウェブサイトエンドポイント」をこの後 CloudFront に設定します
CloudFront 設定(細かい作成項目は省略)
[サービス > CloudFront > ディストリビューション]
[ディストリビューションを作成] を押下
「オリジンドメイン」設定に先ほど作成した S3 バケットウェブサイトエンドポイント(XXXXXXXXXX.s3-website-ap-northeast-1.amazonaws.com)を設定します
設定ポイントはココだけです
後の設定は各環境に合わせて設定してください
リダイレクト事前確認
DNS 設定を ELB から CloudFront へ向き先変更する前に CloudFront 直指定でリダイレクトするか確認してみたいと思います
CloudFront の「ディストリビューションドメイン名」を指定することで CloudFront 直指定が可能となります
それでは、まずはパターン1
$ curl -I https://XXXXXXXXXX.cloudfront.net/backup/xxxxx HTTP/1.1 301 Moved Permanently Content-Length: 0 Connection: keep-alive Date: Thu, 16 Jun 2022 03:29:42 GMT Location: https://BBBBB.example.com/new/backup/xxxxx Server: AmazonS3 X-XSS-Protection: 1; mode=block X-Frame-Options: SAMEORIGIN Referrer-Policy: strict-origin-when-cross-origin X-Content-Type-Options: nosniff Strict-Transport-Security: max-age=31536000 X-Cache: Miss from cloudfront Via: 1.1 xxx.cloudfront.net (CloudFront) X-Amz-Cf-Pop: NRTxx X-Amz-Cf-Id: xxx
想定通り、「/new/」パスが追加され「BBBBB.example.com」ドメインへリダイレクトされました。
https://XXXXXXXXXX.cloudfront.net/backup/xxxxx ⇒ https://BBBBB.example.com/new/backup/xxxxx
続いてパターン2
$ curl -I https://XXXXXXXXXX.cloudfront.net/ HTTP/1.1 301 Moved Permanently Content-Length: 0 Connection: keep-alive Date: Thu, 16 Jun 2022 03:28:22 GMT Location: https://BBBBB.example.com/ Server: AmazonS3 X-XSS-Protection: 1; mode=block X-Frame-Options: SAMEORIGIN Referrer-Policy: strict-origin-when-cross-origin X-Content-Type-Options: nosniff Strict-Transport-Security: max-age=31536000 X-Cache: Miss from cloudfront Via: 1.1 xxx.cloudfront.net (CloudFront) X-Amz-Cf-Pop: NRTxx X-Amz-Cf-Id: xxx $ curl -I https://XXXXXXXXXX.cloudfront.net/xxxx HTTP/1.1 301 Moved Permanently Content-Length: 0 Connection: keep-alive Date: Thu, 16 Jun 2022 03:30:49 GMT Location: https://BBBBB.example.com/xxxx Server: AmazonS3 X-XSS-Protection: 1; mode=block X-Frame-Options: SAMEORIGIN Referrer-Policy: strict-origin-when-cross-origin X-Content-Type-Options: nosniff Strict-Transport-Security: max-age=31536000 X-Cache: Miss from cloudfront Via: 1.1 xxx.cloudfront.net (CloudFront) X-Amz-Cf-Pop: NRTxx X-Amz-Cf-Id: xxx
こちらも想定通り、「/backup/」パス以外でのアクセスなのでパスは継承され「BBBBB.example.com」ドメインへリダイレクトされました。
https://XXXXXXXXXX.cloudfront.net/ ⇒ https://BBBBB.example.com/
https://XXXXXXXXXX.cloudfront.net/xxxxx ⇒ https://BBBBB.example.com/xxxxx
ちょっとオマケで
CloudFront ドメイン名の IP アドレスを nslookup 等で確認し hosts に設定することでドメイン(仮)指定での事前確認も可能です
$ nslookup XXXXXXXXXX.cloudfront.net :省略 Non-authoritative answer: Name: XXXXXXXXXX.cloudfront.net Address: xxx.xxx.xxx.xxx :省略
$ vi /etc/hosts $ grep AAAAA.example.com /etc/hosts xxx.xxx.xxx.xxx AAAAA.example.com
$ curl -I https://AAAAA.example.com/ HTTP/1.1 301 Moved Permanently Content-Length: 0 Connection: keep-alive Date: Thu, 16 Jun 2022 03:28:22 GMT Location: https://BBBBB.example.com/ Server: AmazonS3 X-XSS-Protection: 1; mode=block X-Frame-Options: SAMEORIGIN Referrer-Policy: strict-origin-when-cross-origin X-Content-Type-Options: nosniff Strict-Transport-Security: max-age=31536000 X-Cache: Miss from cloudfront Via: 1.1 xxx.cloudfront.net (CloudFront) X-Amz-Cf-Pop: NRTxx X-Amz-Cf-Id: xxx
DNS 設定変更
AAAAA.example.com レコードを各環境に合わせて ELB ⇒ CloudFront に切り替えてください
設定はこれで完了です
ここでは省略しますが、切替後のリダイレクト確認はしましょう
最後に
以前紹介した ELB リスナールールを活用したリダイレクト設定方法と比べ、設定の手間はかかりますがコスト面ではより安価に抑えられると思います
感覚的にはこんな感じでしょうか
ELB リスナールール・・・手間 : 小 / コスト : 中
CloudFront+S3・・・・・手間 : 中 / コスト : 小
設定までに余裕があるのであれば今回紹介した CloudFront+S3 で
障害等で緊急度が高いときは ELB リスナールールで対応というように使い分けて考えれば良いかと思います