APIGatewayのカスタムドメインをVercelで管理する
前提
- Vercel でドメインを管理していて、ワイルドカードドメインを持っている
- APIGateway にサブドメインを適用したい
例えば、
「Next.js アプリケーションを Vercel でドメインごと管理しており、Backend が AWS で APIGateway を使用していて、 api.example.com みたいに API 用のサブドメインを割り当てたい」みたいなシチュエーション。
手順
- AWS Certificate Manager(以下 ACM)で証明書を発行
- 証明書の所有権確認
- APIGateway にカスタムドメインを適用
- CNAME レコードを追加
- 動作確認
ACM で証明書を発行
割り当てたいサブドメインを決めたら、ACM で証明書を発行します。
赤枠の値を使って所有権を確認します。(次ステップへ)
証明書の所有権確認
確認用の CNAME を登録するだけでは失敗してしまうので、まず CAA レコードを追加。
(オプション) CAA レコードの設定
割り当てたいサブドメインに対して以下の CAA レコードを追加する。
0 issue "amazon.com"
CAA レコードと CNAME レコードの合計 2 レコードを追加するとこのようになります。(letsencrypt.org のものは勝手に追加される)
追加後、少し待って ACM 上で Status が Success になったら成功。
APIGateway にカスタムドメインを適用
証明書が発行できたら早速 APIGateway の Endpoint に対してカスタムドメインを割り当てる変更を行う。
証明書が正しく発行できてたら ACM Certificate が選択できる状態になっていて、 "Create domain name" を押して作成が成功する。
証明書ステータスが Success になっててもここで失敗する場合は少し待つ。
カスタムドメイン設定できると以下のようになる。
赤い部分は後で CNAME として追加するドメイン。
カスタムドメイン設定するだけじゃなくて、カスタムドメインをどのステージに向けるかのマッピングを追加する。
パスも設定できる。バージョニングとかに使うと便利そう。
CNAME レコードを追加
設定作業の〆として、CNAME レコードを追加する。
これまで設定している状態のまま追加しようとすると失敗する。理由は CAA レコードが残っているため。
Vercel のサポートに問い合わせたら以下のような回答が返ってきた。
「CAA レコードは CNAME レコードに従うため、CNAME を使用している場合は必要ないはず。」とのことで、バリデーションを設けてある。
You're getting this message because you can't set a CNAME record and a CAA record on the same subdomain.
To fix this, you need to remove the CAA records for api.xxxxxxxx.com and you will then be able to use the CNAME record. CAA records follow the CNAME record, so they shouldn't be needed when using a CNAME but if you still want to set the CAA records, you can do this at root level by adding the Amazon CAA record to the apex/root domain.
なのでまず CAA レコードを消す。
消したら APIGateway に追加したカスタムドメインの Endpoint を CNAME として登録。
最終的に以下のようになっていれば OK。
動作確認
最後動作確認して終わり。
もしうまく疎通できてなかったら dig とかでトラブルシュートする。
まとめ
個人的に Vercel で CAA レコードを消すという所がハマリポイントでした。
それにしても Vercel のサポートはレスが早くてよい。
Discussion