[AWS]CloudFrontを経由してラズパイ(wordpress)にアクセスする

AWS

本Wordpressはラズパイ4を使用しています。ラズパイ4でもPageSpeed Insightsで80以上を叩き出しましたが、セキュリティの観点からなるべくインターネットの全面には出さずAWS Shieldを使って保護したいです。またCloudFrontを使うことにより負荷軽減・高速化・サーバーダウン時にもエラーページの表示(S3も使います)ができます。

利用したAWSサービス

  • CloudFront(コンテンツ配信)
  • Route 53(DNSとヘルスチェック)
  • S3(Errorページのため)
  • CloudWatch(アラート送信のため)
  • AWS Certificat Manager (SSL証明書発行)

正常系(クライアント->Route53->CloudFront->Route53->Raspi)の設定を行う

私はドメインをお名前ドットコムで取得しました。amazonのRoute 53の機能を使いたかったのでDNSサーバーを移行することとしました。

Route 53 のホストゾーンを作成する

ホストゾーンを作成します。

お名前ドットコムで取得したドメイン名を右に入力します

下記のようにタイプがNSとなっている値を記録しておきます(この画面を開いたままにしておくと便利)。

お名前ドットコムでAWSのサーバーに変更する

お名前ドットコムの「ネームサーバーの変更」クリックします。ドメイン名の該当ドメインを選択します。

「他のネームサーバーを使用」タブから、AWSのネームサーバーを記入します。先ほどのタイプがNSの値です。

CloudFrontの設定を行う

トップ画面にアクセスしてCreate Distributionをクリックします。

コンテンツの種類を聞かれますのでWebを選択します。

設定画面にきます。

Origin Domain NameはCloudFrontがオリジン(ラズパイ)にアクセスするドメイン名を入力します。このドメインはRoute 53で登録しておきます。

Minimum Origin SSL Protocolは許可する最低のSSLプロトコルを選択します。

Origin Protocol Policyはオリジン(ラズパイ)にアクセスするプロトコルを選択します。

Viewer Protocol Policyはクライアントに許可するプロトコルを選択します。画像はHttp and HTTPSにしましたが、その後Redirect HTTPS to HTTPS にして全てHTTPSにすることにしました。

Headerの許可は下記にしました。

User-AgentはWordpressの編集画面のエディタモードの判定に使うようです。

また、SSLはユーザーとCloudFront間とCloudFrontとラズパイ間で証明書が違うためHost情報はCloudFrontで書き換えます。

TTLの設定によりキャッシュを保持する期間を設定します。0にするとキャッシュ保持しません。今回はテストのために60秒にしました。一通りの設定が完了したら86400秒(1日)などにします。

配信用のロケーションはAsiaが含まれている箇所にしておきました。日本語以外で書くつもりがなく、日本からのみのアクセスの想定のためです。全世界からアクセスして欲しければallにしておきましょう。SSL Certificateは「Request or Import…」をクリックして証明書を作成します。

証明書の作成

証明書を作成します。ドメイン名は、CloudFrontにアクセスするためのドメインを入力します。例えば、「tukutano.com」などのように入力します(画像のようなワイルドカード証明書はダメです)。

検証方法はDNSとします。

タグはよくわかりません。詳しい人教えてください。

ドメインの▽ボタンを押すと、Route53でのレコードの作成をクリックすると、Route 53に自動的にCNAMEを追加してくれます。すると検証OKになります(時間がかかるので待ちましょう)。

Route53でAレコードを登録します

CloudFrontのドメイン名を確認して、Route 53でCNAMEを作成しましょう

エラーページの設定

エラーページをS3に設置します。

私の場合は
S3 / CloudFrontドメイン名のバケット / errorディレクトリ / エラーページHTML

に設置しています。

まずバケットを作成する。をクリックします。

バケット名を入力します

デフォルトのままとしました。

外部からアクセスするため、ブロックパブリクアクセスのチェックは外します。

errorフォルダを作成し、ローカルで作成した503.htmlをアップロードしました。

CloudFrontからS3にアクセスする

CloudFrontにS3に設置したhtmlを登録します。Create Originをクリックします。

すでにS3がある場合はプルダウンで表示されます。該当のS3を選択します。

Behaviorタブに移動します。Create Behaviorをクリックします。

Path Patternにはerror/*を指定します。errorディレクトリにエラーごとにhtmlを作成していくことを想定してるためです。

Origin or Origin Groupに作成したS3を選択します。

ErrorPagesタブに移動して、下記のようなエラー時の挙動を作成します。

ヘルスチェック

Route53の機能を使って、オリジンサーバーの生存を監視します。

ヘルスチェックの作成をクリックします。

公開しているホスト名を入力します。

通知を受け取るならメールアドレスを設定します。初めてSNSを設定した場合には認証メールが送信されるので、受診して許可します。

まとめ

AWSを使うことで高負荷のアクセスでも耐えられるようになったと期待できます。AWSを使うことでAWS Shieldで多少は守ってもらえるかもと期待できます。

アラートも作成したのでラズパイがダウンした時には通知が来るのは便利ですね。

また、CloudFrontとS3を利用することでサーバーダウン時のエラーページも作成できました。

ここまでやっとけば趣味用としては十分ではと思ってます。

コメント

タイトルとURLをコピーしました