LoginSignup
17
17

More than 5 years have passed since last update.

S3+CloudFrontのHTTPS静的ウェブサイトでwwwありからwwwなしにリダイレクトする

Last updated at Posted at 2017-06-08
  • 2017.06.08 create

S3+CloudFrontのHTTPS静的ウェブサイトでwwwありからwwwなしにリダイレクトする設定です。
SEO対策として必要になったのでメモしておきます。
本文ではhttps://www.hogehoge.comhttps://hogehoge.com にリダイレクトするものとします。


参照URL: AWS 独自ドメインを使用して静的ウェブサイトをセットアップする


トピック

  1. HTTPS静的サイト本体(wwwなし)を作る
  2. リダイレクト用のS3バケットを作る
  3. CloudFrontのDistributionを作る
  4. DNS設定をする

1. HTTPS静的サイト本体(wwwなし)を作る

まずリダイレクト先であるHTTPS静的サイト本体を作る必要があります。
S3+CloudFront+ACM(AWS Certificate Manager)でHTTPS静的サイトを作ってみたの投稿がとても分かりやすかったので参照してください。
toshihirock様リンクさせていただきます。ありがとうございます。

2. リダイレクト用のS3バケットを作る

ここからが本題。
分かりやすくwww付きのドメイン名でS3バケットを作成します。
バケット名:www.hogehoge.com

作成できたらSバケットプロパティタブのStatic website hostingで「リクエストをリダイレクトする」を有効にします。
- [x] リクエストをリダイレクトする
  ターゲットバケットまたはドメイン: hogehoge.com
  プロトコル: https
「ターゲットバケットまたはドメイン」はwwwなしのドメイン、「プロトコル」はhttpsを指定します。

ここでStatic website hostingのエンドポイントはcloudfrontのオリジンに設定するのでメモっておきます
エンドポイント:www.hogehoge.com.s3-website-ap-northeast-1.amazonaws.com

3. CloudFrontのDistributionを作る

HTTPSなので「1.HTTPS静的サイト本体(wwwなし)を作る」と同様にcloudfrontの設定が必要になります。
先ほどメモったStatic website hostingのエンドポイントをオリジンにする以外は同様に作成します。

Origin Domain Name:www.hogehoge.com.s3-website-ap-northeast-1.amazonaws.com

CloudfrontのDomain NameはDNSの設定で必要になるのでメモっておきます。
Domain Name: hogehoge.cloudfront.net

4. DNS設定をする

Route53でDNSレコードを作成します。
ここではaliasレコードを使用しますがroute53以外のDNS環境ではCNAMEでも問題ないと思います。

Create Record Setから
 Name:www.hogehoge.com
 Type:A-IPv4 address
 Alias:YES
 TTL (Seconds):3600
 Value:hogehoge.cloudfront.net
でCreateします。Valueの値にCloudfrontのDomain Nameを指定します。

cloudfrontとDNSが反映されるまでに数分かかりますがhttps://www.hogehoge.com にアクセスしてhttps://hogehoge.com へリダイレクト出来たら成功です。

17
17
0

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
17
17