🏃
独自ドメインで CloudFront にアクセスできるようにする方法
🎯目的
Route 53で購入した独自ドメインでCloudFrontにアクセスできるようにする方法をまとめて、再現できるようにする
AWS構成例
💡前提
以下のページで作成したCloudFront + S3構成のVue.jsのサイトにhttps://***.cloudfront.net
ではなくhttps://my-tech-portfolio.com
のように独自ドメインで公開する方法を紹介します。Vue.jsやS3を利用しなくとも同様の方法で設定できるはずなので参考にしてください。
- ドメインはAWS Route 53で購入します。
- SSLや名前解決の仕組みなどは解説しません。
🏃♀️手順
1. Route 53 で独自ドメインを購入する
Route 53の「ドメインを登録」にアクセスして、購入したいドメイン名を入力し、購入手続きを完了させます。
購入したいドメイン名を入力してください
「チェックアウトに進む」をクリックしてください
以降、購入手続きを完了させます
購入後、10分ほど経過したら、「登録済みドメイン」画面にて購入したドメインが表示されるようになります。
2. ACM でSSL証明書を発行する
購入した独自ドメインに対して、https
でアクセスできるようにするために Amazon Certificate Manager でSSL証明書を発行します。
Certificate Manager | us-east-1
購入したドメイン名を入力し、一番下の「リクエスト」ボタンをクリックしてください
変更が反映されるまで10分ほど待ってください
3. CloudFront の設定を変更する
独自ドメインでアクセスする作成済みの CloudFront ディストリビューションの設定画面から「代替ドメイン名」「カスタムSSL証明書」を指定してください。
4. Route 53 のホットゾーンを更新し、独自ドメインでアクセスできるようにする
「レコードを作成」を押して、10分ほど経過したら独自ドメインでサイトにアクセスできるようになります。
Discussion