Vercel のサイトに独自ドメインのサブドメインを割り当てる

Gatsby.js + Vercel + microCMS の JAMStack 環境のサイトの仕上げとして、独自ドメインのサブドメインを割り当てます。

Vercel の設定

Vercel のプロジェクトで「Settings」→「Domains」
Vercel のプロジェクトで「Settings」→「Domains」

Vercel のプロジェクトで「Settings」→「Domains」と進みます。

ここで割り当てたいドメインを入力して「Add」。

Invalid Configuration
Invalid Configuration

いったん Invalid Configuration と怒られますがひとまず保留。

ドメイン管理側サービスの設定

詳細部に書かれている cname.vercel-dns.com を CNAMEレコード として設定します。

ドメイン管理側のサービスで指示通りの CNAMEレコード を設定
ドメイン管理側のサービスで指示通りの CNAMEレコード を設定

ドメイン管理側のサービスで指示通りの CNAMEレコード を設定します。これで DNS権威サーバ の設定が書き変わります。

DNSキャッシュサーバ への設定反映を確認

これで30分くらい待ち、 DNSキャッシュサーバ 権威サーバの設定が反映されるのを確かめます。

> nslookup

## 略

> server 8.8.8.8

## 略

> hogehoge.exmaple.jp
サーバー:  dns.google
Address:  8.8.8.8

権限のない回答:
名前:    hogehoge.exmaple.jp
Address:  192.0.2.1

まだですね……。

> hogehoge.exmaple.jp
サーバー:  dns.google
Address:  8.8.8.8

権限のない回答:
名前:    cname.vercel-dns.com
Address:  76.76.21.21
Aliases:  hogehoge.exmaple.jp

お、来ました。

Vercel の設定画面もクリア
Vercel の設定画面もクリア

Vercel の設定画面でもクリアになりました。

これで指定したサブドメインにアクセスすると、確かにデフォルトの vercel.app と同じサイトにアクセスできることが確認できました。

割り当て成功です。

ちなみに、今回はドメイン管理側のサービスで *.exmaple.jp IN A 192.0.2.1 という感じのサブドメインのワイルドカード指定の Aレコード が存在していたのでそれが邪魔しないか気がかりでしたが、大丈夫のようです。

参考

この記事を書いた人

アルム=バンド

フロントエンド・バックエンド・サーバエンジニア。LAMPやNodeからWP、Gulpを使ってejs,Scss,JSのコーディングまで一通り。たまにRasPiで遊んだり、趣味で開発したり。