VercelにRoute53に登録した独自ドメインを設定する

2021.09.24
VercelにRoute53に登録した独自ドメインを設定する

個人利用のWebサービス用に、

お名前.comでドメインを購入し購入したドメインをRoute53に設定しました。


この記事ではRoute53に登録したドメインをVercelのサイトに設定してみます。


Vercelにドメインを設定する

登録するドメインの種類が「Apex Domain」か「サブドメイン」かによって設定方法が変わってきます。



もし、持っているドメインが「tech-broccoli.life」の場合


種類URLRoute53への設定方法
Apex Domaintech-broccoli.lifeAレコード 追加
サブドメインwww.tech-broccoli.life
my-site.tech-broccoli.life
などなど
CNAMEレコード 追加

というそれぞれ設定方法になります。


この記事では

Apex Domain(ex:tech-broccoli.life)とサブドメイン(ex:www.tech-broccoli.life)どちらも設定する方法を記載しますが

どちらか片方を設定したい場合も手順は一緒で、設定したい片方を行えば大丈夫です



Vercelに登録するドメインを登録する

登録したいプロジェクトを選択しSettings → Domainsを選択。



登録したいドメインをフォームに入力しAddボタンを押下

(試しに www.example.com で実行)



するとwwwをつけているからかリダイレクト設定するかどうか、のモーダルが表示されます

サービスの運営をどのようにするか、によって変わってくると思うのでケースバイケースで選択して下さい。


私は今回「Recommended」が付いている1番上を選択しました。




すると

以下のように2つのレコードを作るよう表示されます。


それぞれ「Apex Domain」と「サブドメイン(今回の場合www)」ですね。



Apex Domains


サブドメイン

まだRoute53にレコードを作っていなくドメインの名前解決が行えないため、

Invalid Configuration」と表示されます。


Route53にレコードを作成する

Apex Domainの場合

Vercelで表示された内容をRoute53に設定します

種類
レコード名(空白)
レコードタイプA
Vercel の Value

この状態で「レコードを作成」を押下。


ttlは何がベストか分からなかったので、デフォルト値の「300」のままにしました。

サブドメインの場合

こちらもVercelで表示された内容をRoute53に設定します

種類
レコード名www
レコードタイプCNAME
Vercel の Value

この状態で「レコードを作成」を押下。


こちらもttlは何がベストか分からなかったので、デフォルト値の「300」のままにしました。





Route53のレコード一覧上では以下のようになります



Vercelでドメインが設定出来た事の確認

先ほどのVercelのDomain設定ページを確認します

モザイクばかりで申し訳ないのですが...w


先ほどの「Invalid Configuration」というステータスから「Valid Configuration」に変わっていれば成功です!

おすすめ