Help us understand the problem. What is going on with this article?

S3+ACM+CloudFront+Route53で独自ドメインでhttpsホスティングする

More than 1 year has passed since last update.

S3にアップロード

example.comバケット作成。

コンテンツをアップロード。

aws s3 cp --recursive /path/to/example.com s3://example.com/

S3でホスティングする場合

Cloudfrontと組み合わせる場合はS3でのホスティングは不要だが、テスト時はS3ホスティングの方が便利なので、以下の手順でホスティングする。

コンテンツを公開。

aws s3 ls --recursive s3://example.com | awk '{print $4}' | xargs -I{} aws s3api put-object-acl --acl public-read --bucket ticket.top4.jp --key "{}"

Static website hostingを有効化。

aws s3 website s3://example.com/ --index-document index.html

http://example.com.s3-website-ap-northeast-1.amazonaws.com でサイトが公開されていることを確認。

S3ホスティングを無効化

テストが済んだらStatic website hostingを無効化。

コンテンツを非公開。

aws s3 ls --recursive s3://example.com | awk '{print $4}' | xargs -I{} aws s3api put-object-acl --acl private --bucket example.com --key "{}"

http://example.com.s3-website-ap-northeast-1.amazonaws.comhttps://s3-ap-northeast-1.amazonaws.com/example.com/index.html で見られなくなっている事を確認。

ACMでSSL証明書を作成

North Virginia Regionでexample.comの証明書を取得

CloudFrontのWeb distributionを作成

Origin Settings

  1. Origin Domain Nameでexample.comバケットを選択

  2. Restrict Bucket AccessをyesにしてS3への直接アクセスを禁止

  3. Origin Access IdentityはIdentityが無ければCreate a New Identityで新しいIdentityを作成

  4. Grant Read Permissions on Bucketはyesにしてバケットポリシーを自動設定

Default Cache Behavior Settings

[Viewer Protocol Policy]でhttpからhttpsへリダイレクトするようにする。

Distribution Settings

  1. Alternate Domain Names(CNAMEs)にexample.comを設定

  2. SSL証明書を設定

動作確認

作成したDistributionでWebサイトが公開されている事を確認。

https://xxx.cloudfront.net

Route53

example.comのAliasレコードを作成してxxx.cloudfront.netに向ける。

しばらく待ってからnslookup example.comでDNS設定が反映されている事を確認。

https://example.com でWebサイトが公開されている事を確認。

補足

https://xxx.cloudfront.nethttps://example.com のどちらからでもアクセス出来る状況になってしまうので、SEOが気になる場合はcanonical URLで https://example.com へ向けるように設定しておいた方が良いです。

haracane
キャッシュバック賃貸のCTOやってます。興味分野はRails, Elasticsearch, Hadoopなど。
http://blog.enogineer.com
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした