LoginSignup
0
1

More than 3 years have passed since last update.

S3(Static website hosting) + ACM + CloudFront + Route53で静的コンテンツ公開

Posted at

静的コンテンツをサブドメインで公開したいとの要望を受けてセットアップした際の手順メモです。

前提条件/要件

  • Route53で設定済みドメインのサブドメインとして公開する(レジストラのネームサーバーは設定済み)
  • S3のStatic website hostingを利用する
  • 証明書はACMで新規に発行する

S3のバケット作成/設定

名前とリージョン

  • バケット名:今回利用するサブドメインと同じ名前にします。
  • リージョン:東京リージョンを選択

オプションの設定

バージョニングなどの必要性はなかったので、デフォルトのままにしました。

パブリックブロックアクセス

[パブリックアクセスをすべてブロック]のチェックを外します。
この後の手順でバケットポリシーで公開設定をします。
ACLによるアクセス制御は行わないので、ACL設定のブロックはチェックしてても良いはずですが、すべてチェック外れる設定にしました。

バケットポリシー

以下を参考に作成したバケットのs3:GetObjectを許可するように設定します。

ウェブサイトアクセスに必要なアクセス許可

Static website hosting

以下を参考に設定します。
[エンドポイント]のドメインは、CloudFrontの設定時に使います。

ウェブサイトのホスティングの有効化

コンテンツのアップロード

作成したバケットにコンテンツをアップロードします。
ここまでで、[Static website hosting]のエンドポイントでサイトを参照できるようになります。

ACMで証明書を発行

CloudFrontに設定するSSL証明書をACMで発行します。
米国東部 (バージニア北部) リージョンで作成する必要があります。

CloudFront ディストリビューションにカスタム SSL 証明書を使用できないのはなぜですか?

なお、CloudFrontの設定画面に、ACMに遷移するボタンがあって、そちら遷移するとバージニア北部のリージョンが選択されました。

検証方法の選択

Route53と連携して検証できるので、[DNS の検証]を選択しました。

検証

展開すると、[Route 53 でのレコードの作成]というボタンが現れるので、これを押してセットアップを済ますことができます。
(検証用のCNAMEレコードセットが自動作成されます)

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

  • Origin Domain Name:[Static website hosting]で割り当てられたドメインを設定します。
  • Alternate Domain Names:サブドメインを設定します。
  • SSL Certificate:ACMで作成した証明書を選択します。

その他は要件に合わせて。
以下、大変参考になりました。

CloudFrontのデフォルトルートオブジェクトとS3の静的ウェブサイトホスティングのインデックスドキュメントの動作の違い

ディストリビューションが作成されるまで根気強く待ちます。

Route53でサブドメインのAレコード作成

最後にRoute53でサブドメインのAレコード作成します。
[レコードセットの作成]で[エイリアス]を[はい]し、[エイリアス先]に作成したCloudFrontディストリビューションを選択します。

設定後、反映までにそこそこ時間かかりますので、やはり根気強く待ちます。

以上でコンテンツを公開できました。

0
1
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1