【AWS】OACを設定してCloudFront経由でS3に格納したコンテンツを公開する

みなさんこんにちは。
株式会社エーエスエル　システム部事業推進室の萩原です。

今回はS3に格納したコンテンツをCloudFrontを経由して公開する方法についてメモを残します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/6c87daa3-294d-8864-615d-825aa1f16bf0.png)

# 目的
CloudFrontの設定で、オリジンアクセスアイデンティティー(OAI)がレガシーな設定となったため、オリジンアクセスコントロール(OAC)で実装するための検証備忘として。
#### 流れ
・オリジンアクセスコントロール(OAC)とは
・S3バケットの作成
・CloudFrontディストリビューションの作成
・S3バケットにポリシーを設定する
・動作確認
・補足1：デフォルトルート
・補足2：verify permissions to access-analyzer

# オリジンアクセスコントロール(OAC)とは
そもそも「オリジン」とは、CloudFrontにアクセスされたリクエストが送信される場所のことです。

アクセスコントロールの種類は、オリジンアクセスコントロール (OAC) とオリジンアクセスアイデンティティ (OAI) の2つがあります。

現在OAIはレガシーな設定となっており、OACが推奨されています。
OACでは、以下がサポートされています。

>・すべての AWS リージョンのすべての Amazon S3 バケット
(2022 年 12 月以降に開始されたオプトインリージョンを含む)
・AWS KMS による Amazon S3 サーバー側の暗号化 (SSE-KMS)
・Amazon S3 に対する動的なリクエスト (PUT と DELETE)

※最新の情報は公式サイトを確認してください。

https://docs.aws.amazon.com/ja_jp/AmazonCloudFront/latest/DeveloperGuide/private-content-restricting-access-to-s3.html

かみ砕くと、CloudFrontからオリジンであるS3にアクセスするための権限を設定してあげようということですね。
ということで、今回はOACの設定で進めていきます。

# S3バケットの作成
CloudFrontにアクセスが来た時に受けてくれるオリジンを作成します。
今回は検証なので、適当な静的コンテンツとしてindex.htmlファイルをアップロードしておきます。

バケット名入力やリージョン選択以外は、特に設定の変更は必要ありません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/462c8654-9e25-d5be-c551-4046b379a3a8.png)

バケットの作成が成功したら、index.htmlファイルをアップロードしておきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/df806aea-1565-369c-04e0-5739d33921a5.png)


# CloudFrontディストリビューションの作成
ディストリビューション作成時、オリジンドメインで先ほど作成したS3バケットを選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/ef4ea941-dfa7-de43-062d-0344e11e9497.png)

次に、オリジンアクセスで「Origin access control settings」を選択し、「コントロール設定を作成」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/bacb254e-c61a-c180-8106-4fac786b7d97.png)

特に要件が無い限り設定はそのままで「作成」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/a8627cdb-b655-1af6-c5ce-a8a9443a75c6.png)

その他の項目は任意で設定を変更してください。
「ディストリビューション作成」をクリックします。

ディストリビューションが正常に作成されたメッセージの下に、
「S3 バケットポリシーを更新する必要があります」という警告が表示されます。
S3はリソースベースのアクセスポリシーを設定して、他のリソースからのアクセスを許可してあげる必要があるためです。
「ポリシーをコピー」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/5925df0e-5be4-30fd-d9cc-c13d5da712f4.png)
# S3バケットにポリシーを設定する
オリジンに設定したS3バケットのアクセス許可タブから、バケットポリシーの「編集」をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/45546376-e8b7-b2dd-65b7-7a7810d8e471.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/5e09f387-06d3-8e8c-7ef0-fa311897a9f4.png)
先ほどコピーしたポリシーを貼り付けましょう。
```json
{
    "Version": "2008-10-17",
    "Id": "PolicyForCloudFrontPrivateContent",
    "Statement": [
        {
            "Sid": "AllowCloudFrontServicePrincipal",
            "Effect": "Allow",
            "Principal": {
                "Service": "cloudfront.amazonaws.com"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::cloudfront-test-asl/*",
            "Condition": {
                "StringEquals": {
                    "AWS:SourceArn": "arn:aws:cloudfront::<アカウントID>:distribution/<ディストリビューションID>"
                }
            }
        }
    ]
}
```

# 動作確認
CloudFrontのディストリビューションドメイン名/S3バケットオブジェクト名
をWebブラウザのURLに入力し、格納したindex.htmlのページが表示されることを確認しましょう。
（例）ｈttps://XXXXXXXXXXX.cloudfront.net/index.html
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/0bfca22c-6345-2e88-9f9a-f6926338cef3.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/075848d9-4d4b-2cce-41e1-d7b593b3927f.png)
# 補足1：デフォルトルート
ディストリビューションドメイン名にアクセスした際、index.htmlを返す設定をしたい場合は、ディストリビューションの設定で「デフォルトルートオブジェクト」を入力します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/d087389e-c6f6-3e35-fd1c-993136bf6da2.png)
# 補足2：verify permissions to access-analyzer
今回の検証にあたり、作業用のIAMユーザーにはCloudFrontとS3に対してフルコン権限を与えていました。
S3のバケットポリシー編集時、
「verify permissions to access-analyzer:ValidatePolicy in IAM to use policy validation.」
のエラーメッセージが表示されましたが、ポリシーの編集には成功します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3348322/074bb5c2-1fe7-c1bb-4ff3-89d1f38703af.png)
このメッセージはバケットポリシーの編集とは関係なく、access-analyzerを使用する権限が無いために表示されるエラーです。
access-analyzerについてはここでは深追いしませんが、以下公式サイトを掲載しておきます。

https://docs.aws.amazon.com/ja_jp/IAM/latest/UserGuide/what-is-access-analyzer.html

# おわり
今回は最低限、S3コンテンツの公開に必要な設定でした。
CloudFrontを使うメリットはCDNとして柔軟なキャッシュ設定や、SSL証明書の適用、カスタムドメインの設定など様々です。
是非色々試して有効活用してください。