A little bit of everything

情報系大学院生の備忘録

さくらインターネットで取得したドメインでAWSの静的Webホスティングをする(HTTP、HTTPS)

さくらインターネットで取得したドメインAWSの静的Webホスティングし、AWS Certificate Managerで証明書を作って、httpsの通信をできるようにする方法のメモを残します。

前提

  1. さくらインターネットドメインを取得していること。
  2. AWSのアカウントがあること。

やり方

[1]. 静的Webサイトを独自ドメインでS3上で公開する

S3に置いたコンテンツを独自ドメインで静的Webサイトとして公開する方法は、以下にリンクのAWS公式ドキュメントに従ってください。
ただし1点だけ注意があります。このAWS公式ドキュメントは、Route 53 でドメインを取得することを前提に書かれています。さくらインターネットで取得&管理しているドメインを使用する場合は、この公式ドキュメントの手順を一通り終えた後に、追加作業(後述)が必要です

docs.aws.amazon.com

追加作業:さくらインターネット側にAWSの情報を登録する

  1. 以下のさくらインターネットのサイトから会員ログインをし、 [会員メニュー > ドメイン > ドメイン情報] に行く。
    さくらインターネット|サーバーホスティングサービス

  2. さくらインターネットで取得しているドメイン一覧が表示されるので、その中から使いたいドメインの「WHOIS情報」ボタンを押す。

  3. 登録者の欄のE-mailに、自分の連絡先を登録する。
  4. ネームサーバ1〜4にRoute 53の4つのネームサーバの情報を入力する。Route 53の4つのネームサーバ名の確認方法は次の(1) (2)のとおり。
    (1) Route 53のHosted zonesから今回使用するHosted zoneのドメイン名を選択する。
    (2) 以下の画像のような画面に飛ぶはずなので、NSレコードに書かれている4つのネームサーバ名がメモする。
    f:id:yuukiyg:20190303115838p:plain ↑この4つのネームサーバの情報を、↓のようにさくらインターネットの使いたいドメイン名のWHOIS情報のネームサーバに登録する。 f:id:yuukiyg:20190303114037p:plain

[2]. ACMで証明書を作る

  1. 米国東部(us-east-1)リージョンに移動する。(このリージョンで作った証明書しか、この後CloudFrontの設定するときに使えないらしいので。)
  2. 証明書のプロビジョニングの「今すぐ始める」を押し、証明書の発行申請を行う画面に行く。
    f:id:yuukiyg:20190302234025p:plain

  3. 発行するサーバ証明書ドメイン名(例:example.com)を入力して進む。
  4. 検証方法の選択は、「Eメールの検証」を選択して進む。 f:id:yuukiyg:20190302234757p:plain

  5. 「確定とリクエスト」ボタンを押す。

  6. AWSから"Certificate approval for ドメイン名" のようなタイトルのドメイン認証のメールが届くので、メール内のリンクをクリックして承認(Approve)を行う。

[3]. CloudFrontの設定をする

  1. CloudFrontから「Create Distribution」のボタンを押す。
  2. web distributionの「Get Started」ボタンを押す。
  3. 以下のように設定し、Distributionを作成する。(指定した項目意外はデフォルト値でOK)
Origin Settings
  • Origin Domain Name:作成済みのS3バケットの名前を選択する。
  • Restrict Bucket Access:yesにする。これによりS3のアドレス直打ちでのアクセスを禁止できる。
  • Origin Access Identity:"Create a New Identity"を選択する。
  • Grant Read Permissions on Bucket:yesにする。
Default Cache Behavior Settings
  • Viewer Protocol Policy:デフォルト値でもよいが、おすすめとしては "Redirect HTTP to HTTPS" を選択する。
Distribution Settings
  • Alternate Domain Names(CNAMEs):ドメイン名(S3のバケット名)
  • SSL Certificate:Custom SSL Certificateを選択し、入力欄に「[2]. ACMで証明書を作る」で作成した証明書を選択する。
  • Default Root Object:S3でルートHTMLの名前を入力する。Webサイトのルートのアドレスにアクセスすると、CloudFrontがここで指定したHTMLファイルのURLを返すようになる。
次作業の準備

作成したDistributionの"General" タブから、Domain Nameをメモっておく。

[4]. Route53の設定をする

  1. 既に「[1]. 静的Webサイトを独自ドメインでS3上で公開する」の中でAレコードを作成していたら、そのAレコードをクリックし、Alias Targetを上記の「次作業の準備」でメモったCloudFrontのDomain Nameを入力する。
  2. Route53 に移動し、"Create Record Set" ボタンを押し、Create Record Setを以下のように設定してCreateする。

  3. Name:空白にする。

  4. Type:"A - IPv4 address" を選択する。
  5. Alias:Yesを選択する。
  6. Alias Target:上記の「次作業の準備」でメモったCloudFrontのDomain Nameを入力する。

[5]. ブラウザからHTTPSでアクセスできるか確認する。

正しく設定されていれば、HTTPSでアクセスできます。
上記の作業で「Viewer Protocol Policy」を" Redirect HTTP to HTTPS" で設定している場合は、HTTPでアクセスしてもHTTPSにリダイレクトされると思います。