概要
AWS Amplifyでホスティングしている静的サイトのドメインを変更する際、旧ドメインから新ドメインへHTTPS対応の301リダイレクトを設定する手順をまとめます。
やりたいこと:
https://old-domain.com/* → https://new-domain.com/* (301リダイレクト)
※本記事は、Claudeを使用して作成しています。
なぜAmplifyのリダイレクトルールだけでは不十分なのか
Amplifyの「リライトとリダイレクト」機能でドメイン間のリダイレクトを設定しようとしても、旧ドメインが本番ブランチに紐付いている場合はコンテンツ配信が優先されてリダイレクトが機能しません。
ブランチの紐付けを外しても同様の問題が発生するケースがあります。
解決策:CloudFront + CloudFront Functions で専用リダイレクターを構築する。
構成
https://old-domain.com/<パス>
→ Route 53(Aエイリアスレコード)
→ CloudFront(リダイレクト専用ディストリビューション)
→ CloudFront Functions(301リダイレクト処理)
→ https://new-domain.com/<パス>
メリット:
- HTTPS完全対応
- パス構造を維持したまま301リダイレクト(SEO評価を引き継げる)
- ACM証明書は無料
- CloudFront + CloudFront Functionsのコストはほぼ無料レベル(月数円〜数十円)
前提条件
- 旧ドメインのDNS管理がRoute 53であること
- 新ドメインはすでに稼働していること
手順
ステップ1:ACM証明書の発行
⚠️ CloudFrontで使用する証明書はバージニア北部(us-east-1)リージョンで発行する必要があります。
- AWSコンソール右上のリージョンを 「米国東部(バージニア北部)us-east-1」 に切り替える
- ACM(AWS Certificate Manager)コンソールを開く
- 「証明書をリクエスト」をクリック
- 以下を設定してリクエスト:
- ドメイン名:
old-domain.com(リダイレクト元) - 検証方法:DNS検証
- ドメイン名:
- Route 53に検証用CNAMEが自動追加され、数分で「発行済み」になる
ステップ2:CloudFront Functionsの作成
- CloudFrontコンソール → 左メニュー「Functions」→「関数を作成」
- 関数名を入力(例:
redirect-old-to-new) - 以下のコードを貼り付ける:
function handler(event) {
var request = event.request;
var uri = request.uri;
return {
statusCode: 301,
statusDescription: 'Moved Permanently',
headers: {
location: { value: 'https://new-domain.com' + uri }
}
};
}
- 「保存」→「発行」まで実施する
new-domain.comの部分は実際の新ドメインに書き換えてください。
ステップ3:CloudFrontディストリビューションの作成
- CloudFrontコンソール → 「ディストリビューションを作成」
- 以下を設定する:
基本設定
| 項目 | 値 |
|---|---|
| Distribution name | 任意(例:redirect-old-to-new) |
| Route 53 managed domain |
old-domain.com を選択(自動でRoute 53レコードが追加される) |
オリジン設定
| 項目 | 値 |
|---|---|
| Origin type | Other |
| Origin domain |
new-domain.com(実際にはFunctionsで処理するためダミー) |
デフォルトキャッシュビヘイビア
| 項目 | 値 |
|---|---|
| ビューワープロトコルポリシー | Redirect HTTP to HTTPS |
| 関数の関連付け(ビューワーリクエスト) | CloudFront Functions → ステップ2で作成した関数 |
設定
| 項目 | 値 |
|---|---|
| 代替ドメイン名(CNAME) | old-domain.com |
| カスタムSSL証明書 | ステップ1で発行したACM証明書を選択 |
- 「ディストリビューションを作成」をクリック(デプロイ完了まで数分かかる)
ステップ4:Route 53レコードの設定
Route 53 managed domainでドメインを選択していた場合は自動でAレコードが追加されています。追加されていない場合は手動で設定します。
- Route 53コンソール → 該当ホストゾーンを開く
- 「レコードを作成」をクリック
- 以下を設定する:
| 項目 | 値 |
|---|---|
| レコード名 |
old-domain.com(またはサブドメイン部分) |
| タイプ | A |
| エイリアス | オン |
| トラフィックのルーティング先 | CloudFrontディストリビューション |
| ディストリビューション | ステップ3で作成したもの |
ステップ5:動作確認
curl -I https://old-domain.com/some/path
以下が返れば成功:
HTTP/2 301
location: https://new-domain.com/some/path
パス部分(/some/path)が維持されていることも確認してください。
コスト
| サービス | 料金 |
|---|---|
| ACM証明書 | 無料 |
| CloudFront | 最初の1TB/月まで $0.0085/GB。リダイレクトのみなら月数円〜数十円レベル |
| CloudFront Functions | 月100万リクエストまで無料 |
| Route 53 | 既存ホストゾーンへの追加なら実質無料 |
まとめ
Amplifyのリダイレクトルールではドメイン間の301リダイレクトが正常に動作しないケースがあります。CloudFront + CloudFront Functionsを使うことで、HTTPS対応・パス維持・SEO引き継ぎを満たした301リダイレクトを低コストで実現できます。
同じAmplifyアプリでドメイン変更が発生した場合はこの構成が最もシンプルで確実な解決策です。