Heroku x Route53 でルートドメインで遷移できるようにする

Heroku x Route53 でルートドメインに接続するときにハマったのでメモ

公式では以下のように説明されている devcenter.heroku.com

1. ドメイン名と同じS3のバケットを作る
2. S3を静的ホスティングの設定をして、遷移先のドメイン www.example.com にする
3. Route53でルートドメイン example.com のAレコードをS3のエイリアスで設定をする

だけど、こちらの方法だとhttps のリクエストが出来なかったので、 Route53 と S3 の間に CloudFront を挟む必要がある。

1. ドメイン名と同じS3のバケットを作る

2. S3を静的ホスティングの設定をする

3. 遷移先をドメイン www.example.com にする

4. プロトコルを https にする

5. 設定を保存した時に吐き出される、バケットウェブサイトエンドポイントのURLを保存する

6.バージニア北部のリージョンで example.com のACMを作成をする

7. CloudFrontを作成する

• Origin Domain Name に S3 の バケットウェブサイトエンドポイントのURL を入力をする

• Origin ID は自動で入力される

• Alternate Domain Names に example.com を入力する

• Custom SSL Certificate で 作成した ACM を選択する

あとはデフォルトでも問題ない

8. CloudFront作成後に吐き出せれるエンドポイントのURLを保存する

9. Route53 にexample.com のA レコードで  CloudFrontのエンドポイントにエイリアスを設定する

---

10分程すると http://example.com , https://example.com がそれぞれ www.example.com にリダイレクトされるようになる。