AWS

AWS S3 静的 Webサイト SSL化 https CloudFront

今回は、AWS S3で公開している静的Webサイトを、SSL化する手順のメモとなります。

尚、S3でサイトを公開する設定は、以下の内容で行なっている前提となります。

AWS S3 静的 Webサイト 公開

・Amazon S3 を使用して静的ウェブサイトをホスティングする

https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/userguide/WebsiteHosting.html

・CloudFront を使用して Amazon S3 バケットの HTTPS リクエストを処理する方法を教えてください。

https://repost.aws/ja/knowledge-center/cloudfront-https-requests-s3

ACM SSL 証明書 作成

リージョン指定

はじめに証明書作成を開始する前に、リージョンをus-east-1に変更します。

AWS select Region

変更理由は、CloudFrontディストリビューションで指定できる証明書が、
現状us-east-1の証明書のみだからです。

証明書作成リクエスト

リージョンを変更したら、AWS Certificate Manager(ACM)のところから証明書リクエストを行います。

AWS ACM Certificate Request

まず、完全修飾ドメイン名は、説明通りドメイン名を指定します。

検証方法は、今回はDNS検証にします。

AWS ACM Certificate Request

続けて、キーアルゴリズムタグは任意の内容で指定します。
すべて入力・指定できたらリクエストします。

AWS ACM Certificate Request

証明書 DNS設定(Route53)

リクエストできたら検証を完了させます。

証明書の詳細のドメイン部分に表示されている、
Route53でレコードを作成ボタンを使用して、CNAMEレコードを作成します。
※自身でRoute53で登録しても完了できます。
(CNAME名とCNAME値を確認して、ホストゾーンにレコードを登録します)

AWS ACM Certificate Request

CNAMEレコードを登録すると、検証処理が行われます。
正常に処理されると、ドメインのステータスも成功になり、証明書も発行済みになります。
(今回試した際には、数秒で検証が完了し成功となりました)

AWS ACM Certificate Request


CloudFrontディストリビューション設定

ディストリビューション作成

続けて、CloudFrontの設定を行います。

AWS CloudFront distribution request

AWS CloudFront distribution request

まず、Origin domainのところは、対象のS3バケット名を指定します。

AWS CloudFront distribution request

Origin domainをS3のバケットで指定すると、
Webサイトのエンドポイントを使用のボタンが表示されるため、こちらをクリックします。

AWS CloudFront distribution request

次のプロトコルは、目的の値を指定します。

AWS CloudFront distribution request

続けて、Origin path – optionalは、ドメイン名を指定します。
※別日に試したら、「/」を先頭に指定するように指示されました。
「/」+ ドメイン名の形で入力します。(例:/www.test.com)

尚、名前(オリジン名を入力)は、S3バケットの名称が自動的に入力されるはずです。
もしも自動的に入力されなかった場合、
名前(オリジン名を入力)に、Origin domainと同じ名称を入力します。

AWS CloudFront distribution request

次のEnable Origin Shield追加設定も任意で行います。

AWS CloudFront distribution request

続けて、デフォルトのキャッシュビヘイビアのところも任意で設定します。

AWS CloudFront distribution request

その下のキャッシュキーとオリジンリクエストは、
Cache policy and origin request policy(recommended)で設定します。

レスポンスヘッダーポリシーは、必要に応じて指定してください。

AWS CloudFront distribution request

ウェブアプリケーションファイアウォール(WAF)も必要に応じて有効化してください。

AWS CloudFront distribution request

次の設定の部分は、Custom SSL certificate – optional以外は任意の内容を指定します。

AWS CloudFront distribution request

Custom SSL certificate – optionalは、登録済みの証明書を選択します。

AWS CloudFront distribution request

以降の設定も必要に応じて指定して作成を行います。

AWS CloudFront distribution request

ディストリビューション DNS設定(Route53)

ディストリビューションを作成後、Route53でDNS設定を行います。
Route53のところから、ドメインのホストゾーンを開きます。

既にS3の機能でWebサイトを独自ドメインで公開している場合、
公開用のタイプAレコードが存在すると思います。
こちらをディストリビューション用の設定に変更します。
(httpでのアクセスは出来なくなります)

AWS CloudFront distribution request

 

トラフィックのルーティング先は、CloudFrontのディストリビューションを選択します。

AWS CloudFront Route53

下の値指定の部分は、CloudFrontを選択していれば、
先ほど作成したディストリビューションが候補に出てくると思いますので、選択して保存します。

AWS CloudFront Route53

ここまで設定できたら、
最後にブラウザ等でアクセスして設定が反映されていることを確認します。

DNSの設定などが反映されるまでに時間がかかることもあるようですが、今回はすぐに反映されました。


今回のメモは以上となります。

S3でWebサイトをホスティングできるのは便利ですが、
独自ドメインのSSL化は直接サポートされていないので、
CloudFrontの機能を利用する必要があります。

HTTPS対応以外にも、パフォーマンスの向上、
セキュリティ強化などを目的にCloudFrontはよく利用すると思うので、
色々とメモしていきたいと思います。

都内でエンジニアをやっています。 2017年に脱サラ(法人設立)しました。 仕事で調べたことや、気になったことをメモしています。
投稿を作成しました 166

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


関連投稿

検索語を上に入力し、 Enter キーを押して検索します。キャンセルするには ESC を押してください。

トップに戻る