生徒S3で作ったWEBサイトでもhttps対応あできますか？
先生S3のWEBサイトをhttpsや独自ドメインで公開する方法を説明します
事前準備
この記事では、AWSのS3で作成したWEBサイトをCloudFrontと連携してhttpsに対応します。
S3でWEBサイトを作成する手順は以下の記事になります。
CloudFrontを作成してS3のWEBサイトをhttpsに対応させる
AWSのS3を利用すると、サーバー運用費を抑えたWEBサイトを作成できます。
ただ、S3のWEBサイトホスティング機能はhttpでのWEBサイト公開にしか対応していません。
CloudFrontをS3と連携させて、S3のWEBサイトをhttpsで公開します。
作成したS3のバケットのバケットウェブサイトエンドポイントをクリップボードなどにコピーしておきます。
AWSのマネジメントコンソールで検索欄にCloudFrontと入力して、リストからCloudFrontを選択します。
CloudFrontのコンソール画面で CroudFlontディストリビューションを作成をクリックします。
ディストリビューションの作成画面になります。
一番上のオリジンドメイン欄に、準備しておいたS3のウェブサイトエンドポイントを入力します。
オリジンドメイン欄にカーソルを入れると、AWSで利用しているドメインのリストが表示されます。
リストからS3で先程作成したバケットのドメインを選択するとWEBサイトエンドポイントを使用するよう促されるのでクリックします。
ウェブサイトエンドポイントの値に置き換わります。
オリジンドメインを入力すると名前欄にも同じ値が自動的に入ります。
デフォルトのキャッシュビヘイビア では、http://〜での接続をhttps://〜に繋ぎ変えるために、ビューワープロトコルポリシーをRdirect HTTP to HTTPSにします。
ウェブアプリケーションファイアウォール（WAF）はセキュリティ保護を有効にしないでくださいを選択します。
設定は何も変更せずに ディストリビューションを作成をクリックします。
ディストリビューションが作成されます。
ディストリビューションにアクセスできるか確認します。
ディストリビューションドメイン名をコピーしておきます。
ブラウザに貼り付けると、httpsでWEBサイトにアクセスできます。
Route53で独自ドメインに対応する
これまでの手順で、CloudFrontを利用してhttpsでWEBサイトを公開しています。
ただ英数字の羅列.cloudfront.netというURLは分かりにくいので、独自ドメインでアクセスできるように設定します。
この記事の手順で独自ドメインを利用するには、Route53で独自ドメインのホストゾーンが必要です。
Route53で独自ドメインを取得した場合、ホストゾーンは自動的に作成されます。
お名前.comなど他のドメイン登録サービスで独自ドメインを取得した場合は、以下の記事の手順で作成できます。
CloudFrontにSSL証明書を設定する
CloudeFrontで、この記事で作成したディストリビューションを選択します。
設定の 編集をクリックします。
代替ドメイン名（CNAME）に以下の2つの内容を入力します。
- 独自ドメイン名（例： example.com）
- www.独自ドメイン名（例： www.example.com）
カスタム SSL 証明書欄の証明書をリクエストをクリックします。
証明書をリクエスト画面に移動しますので 次へをクリックします。
パブリック証明書をリクエスト画面で完全就職ドメイン名にディストリビューションの画面で代替ドメイン名（CNAME）に入力したのと同じドメイン名を入力します。
- 独自ドメイン名（例： example.com）
- www.独自ドメイン名（例： www.example.com）
検証方法はDNS 検証・推奨を選択して リクエストをクリックします。
証明書のリクエストが完了しますので 証明書を表示をクリックします。
作成直後の 証明書を表示ボタンを閉じてしまった場合、説明書の一覧メニューから説明書を表示できます。
証明書の画面で Route 53 でレコードを作成をクリックします。
作成されるレコードの確認画面が表示されるので レコードを作成をクリックします。
Route53のホストゾーンにレコードが作成されます。
作成直後のステータスは保留中の検証となっています。
1分程度でステータスが成功に変わります。
Route53とCloudFrontを連携する
Route53の独自ドメインのホストゾーンにCloudFrontのディストリビューションのレコードを作成して連携します。
Route53で独自ドメインのホストゾーンを選択します。
ホストゾーンの内容が表示されるので レコードの作成をクリックします。
レコードの作成画面でレコード名は空のままにしてエイリアスのチェックをONにします。
トラフィックのルーティング先のリストからCloudFrontディストリビューションへのエイリアスを選択します。
ディストリビューションを選択欄で今回作成したディストリビューションを選択します。
レコード レコードを作成をクリックします。
ディストリビューションのレコードが作成されます。
続けてもう1件レコードを作成します。
2個目のレコードはレコード名にwwwと入力して、あとは1個目と同じ内容で作成します。
これですべての手順が完了です。
ブラウザからhttps://独自ドメインおよびhttps://www.独自ドメインでアクセスできることを確認します。
