AWS Hands-on for Beginners　Amazon CloudFrontおよびAWS WAFを用いて エッジサービスの活用方法を学ぼう：学習メモ

## はじめに

AWSハンズオン for Beginnersシリーズとして提供されている「[Amazon CloudFrontおよびAWS WAFを用いて エッジサービスの活用方法を学ぼう](https://pages.awscloud.com/JAPAN-event-OE-Hands-on-for-Beginners-CF_WAF-2021-reg-event.html)」を実施した際のメモです。
AWSではリージョン、AZ上で提供されるサービスのほか、エッジサービスという、エッジロケーション上から提供されるサービスがあります。
このエッジロケーションはリージョン、AZよりもエンドユーザーに地理的に近い設計になっており、エッジサービスは高速で効率的な通信が必要なDNS、CDNなどの機能を提供しています。
サービスでいうと[Route53, Global Accelerator, CloudFront, WAF, Shield, Lambda@Edge](https://aws.amazon.com/jp/edge/services/)などです。
今回のハンズオンでは、このエッジサービスの内、CDNサービスであるAmazon CloudFront、WebアプリケーションファイアウォールサービスであるAWS WAFを使用した簡単なアプリを作成します。
ハンズオンを通して、エッジサービスがどのように機能するのか体験します。

## アジェンダ

1. AWSグローバルインフラストラクチャとエッジサービスについて
2. AWSのエッジサービスとContent Delivery Networkについて
3. Amazon CloudFrontのハンズオン その1 (静的コンテンツの配信設定)
4. Amazon CloudFrontのハンズオン その2 (コンテンツキャッシュの設定)
5. Amazon CloudFrontのハンズオン その3 (動的コンテンツの配信設定①)
6. Amazon CloudFrontのハンズオン その4 (動的コンテンツの配信設定②)
7. AWS WAFの概要と設定項目の確認
8. AWS WAFのハンズオン
9. 本シリーズのまとめ、リソースの削除

## メモ

### CloudFront

#### CloudFrontとは

CloudFrontは動画や静的なコンテンツ、動的なコンテンツなどを迅速かつ安全に配信できるCDNサービスです。
クライアントからのリクエストに対するレスポンスをキャッシュすることで、レスポンス速度の向上とアプリケーション側の負荷軽減ができます。
CDNには、ユーザーのリクエストによって内容が変わらないコンテンツ（静的コンテンツ）をキャッシュするのが一般的です。

#### CloudFrontの設定構成

CloudFrontの設定は大きく3つに分かれます。
Distribution：1つのCloudFrontを表します。複数のBehaviorとOriginの設定をまとめています。
Behavior：ユーザーからのリクエストに対する振る舞いを定義します。キャッシュするパスの条件だったり、リクエストを許可するHTTPメソッドやプロトコルなどを設定します。
Origin：オリジンのエンドポイントを定義します。S3、API Gatewayなど。また、オリジンへのアクセスコントロールの設定もここで行います。
なお、このセキュリティ設定は現在、オリジンアクセスコントロール（OAC）とオリジンアクセスアイデンティティ（OAI）の2種類ありますが、前者が推奨されています。

#### 雑記1

CloudFrontから払い出されたドメインにアクセスするとオリジンのS3バケットにホストされているindex.htmlにアクセスできました。
開発者ツールのNetworkタブでリクエスト情報を見ると、レスポンスヘッダに**x-cache: Miss from cloudfront**と表示されていました。
これはリクエストしたがコンテンツがCloudFrontにキャッシュがなく、オリジンにアクセスしたことを表します。

#### 雑記2

ビヘイビアの設定にキャッシュポリシーがあり、パス毎に指定できます。
キャッシュポリシーでキャッシュのTTLやキャッシュキー（指定したキーと一致したらキャッシュを返す設定）、圧縮などの設定ができます。
このように独自に設定を定義できる他、AWSですでに用意されている設定（マネージドキャッシュポリシー）もあります。
index.htmlへのアクセスはCacheDisableというマネージドキャッシュポリシーを設定しており、キャッシュしない設定をしていました。
staticディレクトリ配下の静的コンテンツをキャッシュするため、新しくカスタムキャッシュポリシーを追加し、新しいビヘイビアに関連づけました。
なお、ビヘイビアは優先順位が小さいものから評価されます。
static配下のコンテンツのレスポンスヘッダに**x-cache: Hit from cloudfront**と表示されていました。
これはCloudFront内にキャッシュがあり、それを返却したことを表します。

#### 動的コンテンツの配信

エンドユーザーからCloudFront経由でAPI Gatewayにリクエストを渡す場合、リクエストの内容がCloudFrontでフィルタリングされます。
デフォルトだとクエリストリングがフィルタリングされ、API Gatewayに渡されません。
CloudFrontのホワイトリスト設定（ビヘイビア設定の1つであるオリジンリクエストポリシー）を定義することで渡せるようになります。
最初に、CloudFrontコンソールのポリシーからオリジンリクエストポリシーを追加し、API Gatewayに渡すクエリストリングをホワイトリストに追加します。
次に、既存のディストリビューションにオリジンとしてAPI Gatewayのドメインを追加します。
さらに、API GatewayとCloudFrontを関連づけるビヘイビアを作成します。ビヘイビアに上記で作成したオリジンおよびAPIのパス、オリジンリクエストポリシーを指定します。
以上により、動的コンテンツをCloudFront経由で配信できます。

### AWS WAF

#### AWS WAFとは

AWS WAFとはAWSが提供する境界型のWebアプリケーションファイアウォールです。
CloudFront、API Gateway、ALB、AppSyncなどのサービスと簡単に連携でき、外部からの様々な攻撃を防御できます。

#### AWS WAFの設定構成

AWS WAFの設定は「Web ACL」と「ルール」の大きく2つに分かれます。
Web ACL：複数のルールをまとめた大枠を表します。実際にサービスに関連づけるのもこのWeb ACLです。
ルール：通信内容を監視し、不正な通信を遮断するルールのセットを表します。このルールは「Statement」と「Rate-based rule」、「Action」の3つから構成されます。
Statement：検査する対象と条件を定義します。
Rate-based rule：5分間の間にリクエストを何回許容するかを定義します。
Action：指定した条件から通信を遮断するか、許可するかを定義します。
ルールには適用順があり、条件に合致するか順番に検査していきます。
1つも条件に引っ掛からなかった場合、デフォルトで定義したActionが実行されます。

#### AWS WAFのハンズオン内容

本ハンズオンでは、リクエスト元の国によって通信を許可するか、ブロックするかをテストしました。
リクエスト元が日本の場合、ブロックするという設定を追加し、ディストリビューションにアクセスするとブロックされ、403エラーになることを確認しました。

## ハンズオンの感想

大規模なWebサービスを開発するのであれば、CDNサービスは必須です。
AWSを使用するのであれば、サービスとの連携も手軽にできるため、CloudFrontを積極的に活用すべきと考えます。
AWS WAFも同様です。