Herokuの独自ドメインをRoute53、Cloudfrontで設定する手順

Sat Dec 29, 2018 - aws
Thu Jan 16, 2020

使うもの

  • heroku アプリは既に作成済

  • Route53 取得済み

  • CloudFront

  • AWS Certificate Manage

HerokuとRoute53の独自ドメインを紐付け(AWS)

DashboardからHosted zonesに移動し、Create Hosted Zoneを選択。

Domain NameにRoute53で取得したドメインを入力し、作成する。

次に、Create Record Setを選択します。そして以下を入力してcreateします。

  • Name

  • Nameにはwww

  • TypeにはCNAMEを選択

  • Valueにはherokuアプリの名前(例: sampleapp.herokuapp.com)

herokuアプリの名前はherokuのsettings画面から確かめることができます。

HerokuとRoute53の独自ドメインを紐付け(Heroku)

ターミナルからでも設定できますが、herokuのコンソール画面からも設定できます。

Add domainを選択し、Route53で設定したドメインを設定するだけです。

wwwありとなしのドメインを設定したらこんな感じになるはずです。

ACMを利用して無料のサーバー証明書を発行

検証の方法はEメールとDNSを使う方法の2通りありますが、今回はRoute53でドメインを取得しているのでDNSを使った検証の方がオススメです。AWSがドメインを検証して証明書を発行するまでに最大で30分以上かかる場合がありますけど。

Eメールの検証を使う場合

AWSコンソールからCertificate Managerを選択。

ここでの注意点としてリージョンをバージニア北部にしておくこと(2017/10月現在)。これを間違えるとこの後、うまくいかないです。

次に証明書のリクエストを選択。

ドメインを入力したら確認とリクエストを選択。

しばらくするとAWSから届くドメイン認証メールが届きます。

「I Approve」で承認します。

承認するとSuccess!と表示されます。

全ての工程がうまくいくと、状況が発行済みになっていると思います。以上で、ACMを利用して無料のサーバー証明書を発行する手順は終わりです。

DNSの検証を使う場合

ドメイン名を入力

DNSの検証を選択

このブログのドメインはRoute53を使って取得しているので、Route53でのレコードの作成を選択。しばらくすると成功します。

こんな感じになります。

成功です。

CloudFront設定

Create Distributionを選択。

webのGet Startedを選択。

Origin Domain Nameの項目にHerokuのドメイン名を記入する。

sample123456.herokuapp.com/

すると、こんな感じになります。

次に「Custom SSL Certificate」を選択し、先に作成したサーバ証明書を指定します。

Alternate Domain Names (CNAMEs)に必ず自分のドメインを記入。

Route53の設定

ALIASをCloudFrontに変えます。

CloudFrontの設定が終わっていたらAilas Targetに出てくるので、それを選択。

これで終わりです。

Tags: heroku
See Also