AWS Amplifyのデプロイ先に独自ドメインを指定する方法


はじめに

AWS Amplify では、リモートリポジトリにコミットしたら自動デプロイできますが、デフォルトでは amplifyapp.comのサブドメインにデプロイされます。これを独自ドメインにデプロイすることもできます。

ですが、ドメインのDNSプロバイダーが ANAMEをサポート、もしくは ALIAS をサポートしている必要があります。

お名前.comは、残念ながら ANAME/ALIAS をサポートしていないので、Amplify のデプロイ先に使用することはできません。そのため、AWS の Route 53にドメインを移行する必要があります。

この記事では、途中までお名前.comでのドメイン設定を紹介していますが、その結果どうなるか。そして、Route 53で登録したドメインで自動デプロイする設定方法をご紹介します。

独自ドメインの設定

ドメイン管理 > カスタムドメインの追加 から、独自ドメインを追加します。

f:id:fnyablog:20190714090421p:plain:w480

カスタムドメインを検索すると、独自ドメインの設定ができるようになります。

f:id:fnyablog:20190714090551p:plain:w480

カスタムドメインの追加画面で、独自ドメインの設定を行います。ここでは、サブドメイン名をデフォルトから変更し、リダイレクトのチェックを外しています。

f:id:fnyablog:20190714090631p:plain:w480

設定の途中で、以下のような CNAME を登録するよう表示されるので、お名前.comで CNAMEを登録します(登録方法は割愛)。

f:id:fnyablog:20190714090758p:plain:w480

すると、以下のように設定が正常終了します。

f:id:fnyablog:20190714090946p:plain:w480

ですが、設定した独自ドメインにアクセスするとエラー画面が表示されます。

f:id:fnyablog:20190714091109p:plain:w480

ここまでが、お名前.comの限界のようです。ANAME/ALIASをサポートしている DNSサービスならなんとかしようもあったのですが残念です。

この場合、ドメインをお名前.comから Route 53に移管する必要があります。移管の方法は以下の記事が詳しいです。

dev.classmethod.jp

この記事にしたがってドメインを移管すればよいのですが、.jp ドメインはなんと$90も移管手数料がかかるじゃないですか!?

f:id:fnyablog:20190714091452p:plain:w480

.jp ドメインを移管しなければいけない方はご愁傷様ですが、あんまりに高いので、ここでは以下のように新規ドメインを取得します。

.net ドメインはたったの?$11です。ドメインの登録反映に20分くらいかかりましたでしょうか。

f:id:fnyablog:20190714091607p:plain:w480

最初から設定をやり直します。

f:id:fnyablog:20190714091756p:plain:w480

若干時間がかかりますが、登録ができたようです。

f:id:fnyablog:20190714091939p:plain:w480

登録したドメインにアクセスすると、今度はちゃんと表示されました!

f:id:fnyablog:20190714092202p:plain:w480

おわりに

Amplify のデプロイ先に独自ドメインを指定する際、お名前.comが使用できないというのは大きな罠でしたが、Route 53を使用すれば簡単に設定できることが分かりました。

活用していきたいですね。