おひとり

できる限りひとりで楽しむための情報やプログラミング情報など。

【AWS】CloudFrontを使ってHTTPSリダイレクトするだけのサーバを構築

前回のブログではS3を使ったHTTPリダイレクトサーバを構築しました。
ここでは、もう一歩踏み込んで、CloudFrontを使ったHTTPSでのリダイレクトサーバを構築してみましょう。

例として、https://ohitori.fun -> https://www.ohitori.fun というドメインにリダイレクトするサーバを構築します。

今回の構成

今回はリダイレクトそのものはS3にて行います。
ただし、S3では証明書をインポートしてのHTTPSの接続には対応していません。(現在)
そのためCloudFrontをHTTPSのエンドポイントとして、S3の前に置きます。

f:id:hitoridehitode:20200828003216p:plain
S3とCloudFrontを組み合わせてHTTPSリダイレクトを実現

S3の準備

S3を使って、まずはhttp://ohitori.fun -> http://www.ohitori.funへのリダイレクトサーバを構築します。
今回の構成は、CloudFrontでこのS3のリダイレクトサーバに繋ぎます。よって、まずはS3でのリダイレクトサーバを構築しましょう。

具体的な手順は以下の記事に分けています。
まずはこちらを完了させましょう。

※エンドポイントのドメインを控えて置きましょう。

www.ohitori.fun

ACMで証明書の準備

ACM(AWS Certificate Manager)はAWSのいわゆるSSL/TLS証明書(サーバ証明書といわれることも)を発行するサービスです。こちらはpublicなものなら追加料金はかかりません。

まずはACMにアクセスしましょう。
ACMにアクセスしたら、リージョンを米国東部 (バージニア北部)us-east-1に切り替えます。

f:id:hitoridehitode:20200827234745p:plain
リージョンを「米国東部 (バージニア北部)us-east-1」に切り替え

これは、証明書をCloudFrontで使うため。CloudFrontはグローバルなサービスのため、us-east-1(バージニア北部)のリージョンで作成した証明書しか利用できないからです。

リージョンを選択したら、「証明書のプロビジョニング」の「今すぐ始める」をクリックしましょう。(すでにACMで発行した証明書を持っている人は「証明書のリクエスト」をクリックします。

f:id:hitoridehitode:20200827235155p:plain
「証明書のプロビジョニング」の「今すぐ始める」をクリック

そして、「パブリック証明書のリクエスト」をクリックします。

f:id:hitoridehitode:20200827235231p:plain
「パブリック証明書のリクエスト」をクリック

続いて、証明書のドメイン名を入力しましょう。ここではリダイレクト元のドメインを入力します。

今回はhttps://ohitori.fun -> https://www.ohitori.funなので、ohitori.funを入力します。

f:id:hitoridehitode:20200827235356p:plain
リダイレクト元のドメインを入力

これ以降はドメインを所有しているかどうかの検証になります。
どちらか自分の可能な方を選択して実施しましょう。
ここでは、ほとんどの人は自分でドメインを管理していると思うので、「DNSの検証」を選びます。

f:id:hitoridehitode:20200827235518p:plain
自分で可能な検証方法を選びましょう。

DNS検証では、DNSにCNAMEレコードを追加することで認証されます。
画面に表示されたCNAMEレコードをDNSの設定に追加しましょう。
Route53を使っている場合は「Route53でのレコードの作成」をクリックすると自動でレコードが作成されるため、とても便利です。

f:id:hitoridehitode:20200827235548p:plain
Route53を使っているひとはワンクリックでレコードの作成が完了

あとは画面に従って証明書の作成が完了するのを待ちましょう。

CloudFrontでDistributionを作成

さて、いよいよCloudFrontを使っていきます。
AWSのCloudFrontのページにアクセスしましょう。
2020年8月28日現在、残念ながらまだ日本語化されておりません。。。

まずは「Create Distribution」をクリックしましょう。

f:id:hitoridehitode:20200828000456p:plain
「Create Distribution」をクリック

続いて、「Web」側の「Get Started」をクリックします。

f:id:hitoridehitode:20200828000544p:plain
「Web」側の「Get Started」をクリック

すると、多数の設定項目が現れます。(最初にみるとちょっと圧倒されてしまいます。。。)
ただし、今回は3点のみ設定すればOK。

Original Domain Name

ここには先ほどリダイレクトを設定したS3のドメイン名を入力します。

f:id:hitoridehitode:20200828001056p:plain
リダイレクトを設定したS3のドメイン名を入力

入力補完では出てきません。控えていない人はS3に戻ってエンドポイントをコピーしよう。

S3 > バケットを選択 > プロパティ > Static website hosting > エンドポイント

詳しくは前回の記事をご覧ください。

www.ohitori.fun

Alternate Domain Names(CNAMEs)とSSL Certificate

少し下にスクロールしてDistribution Settingsを見つけましょう。そこに残り2つの設定項目があります。

Alternate Domain Names(CNAMEs)には、リダイレクト元のドメイン名を入力しましょう。
ここでは、https://ohitori.fun -> https://www.ohitori.funなので、リダイレクト元のohitori.funを入力します。

続いて、SSL Certificateの設定です。
チェックボックスの「Custom SSL Certificate(example.com)」をクリックします。
そして、テキストボックスをクリックすると、先ほどACMで作成した証明書がでてくるので、それを選択します。
※もしここに証明書が出てこない人は、ACMで証明書を作成するときにリージョンが「(バージニア北部)us-east-1」になっていなかった可能性があります。確認してみよう。

f:id:hitoridehitode:20200828001519p:plain
Alternate Domain NamesとSSL Certificateの設定をしよう

以上で設定完了です。

StatusがDeployedになったら、IDをクリックしましょう。

f:id:hitoridehitode:20200828001741p:plain
statusがDeployedになったらIDをクリック

そこに出てきたDomain Nameを確認しておきましょう。

f:id:hitoridehitode:20200828001818p:plain
Domain Nameを確認!

これでCloudFrontの作成は完了です。

DNS(Route53)の設定

最後にRoute53でDNSのレコードを作成しましょう。
以下のようなAレコードを作成します。

  • レコード名:リダイレクト元のドメイン(今回はohitori.fun)
  • 値/トラフィックのルーティング先:先ほど作成したCloudFrontのDomain Name -レコードタイプ:Aレコード

前回の記事でS3のリダイレクトを設定したひとは、すでにAレコードができているはずです。
そのレコードを編集するだけでOKです。まだの人はレコードを新規に作成しましょう。

設定は以下のようにしましょう。

f:id:hitoridehitode:20200828002206p:plain
Aレコードの作成

※Route53の設定は、前回の記事も参考にしてください。

www.ohitori.fun

以上で全ての設定が完了です!

リダイレクト元のURLにアクセスし、意図した動作になることを確認しましょう。

参考リンク

qiita.com

f:id:hitoridehitode:20200828003426p:plain