[AWS]画像の配信方法

**2020年2月8日現在の内容です。**

構成イメージ
<img width="1137" alt="スクリーンショット 2020-02-08 10.13.09.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/8ca56139-5ab0-93e5-676c-71367b4e91e1.png">

**画像の保存場所をWebサーバーではなくS3にする理由**

- Webサーバーのストレージが画像で一杯になることを防ぐ
- HTMLへのアクセスと画像へのアクセスを分けることで負荷分散する
- サーバーの台数を拡張しやすい
    - Webサーバー上に画像が保存されていると、Webサーバーの台数を増やした際に、画像を同期する必要があり、スケールアウトが難しい
    - 画像の保存場所は分離されていたほうがWebサーバーの台数を簡単に増やすことができる
- コンテンツ配信サービスから配信することで、画像配信を高速化できる

## 用語説明
### S3(Simple Storage Service)
安価で耐久性の高いAWSのクラウドストレージサービス

特徴

- 0.023USD/GB・月と安価(1GB約3円/月)
- 99.999999999%の高い耐久性
- 容量無制限(1ファイル最大5TBまで)
- バケットやオブジェクトに対してアクセス制限を設定できる

重要概念

- バケット
    - オブジェクトの保存場所(名前はグローバルでユニークな必要がある)
- オブジェクト
    - S3に格納されるファイルで、URLが付与される(データ本体)
    - バケット内オブジェクト数は無制限
- キー
    - オブジェクトの格納URLパス

利用シーン

- 静的コンテンツの配信
    - img画像はS3から配信する
- バッチ連携用のファイル置き場
    - S3にファイルを置いて、バッチでそのファイルを参照して処理を行う
- ログなどの出力先
    - 定期的にS3にログを送る
- 静的ウェブホスティング
    - 静的なWebサイト(ランディングページ等)をS3から公開する

### CloudFront
高速にコンテンツを配信するサービス
CDN(Content Delivery Network)のサービス

オリジンサーバー(元となる画像を配信するサーバー)上にあるコンテンツを世界中100箇所以上にあるエッジロケーション(データセンター)にコピーし、そこから配信する

特徴

- 高速
    - ユーザーから最も近いエッジロケーションから画像を配信する
- 効率的
    - エッジサーバーでコンテンツのキャッシングを行うので、オリジンサーバーに負荷をかけずに配信できる

#### ディストリビューション
CloudFrontの設定(ルール)

### SSLサーバー証明書
Webサイトの運営者が存在することを保証し、ブラウザとWebサーバーで暗号化通信を行う際の電子証明書

### Certificate Manager
SSLサーバー証明書の管理を行うAWSサービス

### CNAME
すでに定義されているドメイン名に対し別名を定義すること

## S3のバケット作成
AWSコンソールからS3を検索し、クリック
<img width="1680" alt="スクリーンショット 2020-02-02 17.12.45.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/01192e97-bed3-cb44-1829-f7854efd8d69.png">

「バケットを作成する」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 17.15.12.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/4808833e-997e-db77-c522-fcdbaed0f529.png">

以下の通り設定し、「次へ」をクリック
バケット名：一意の名前
<img width="1680" alt="スクリーンショット 2020-02-02 17.21.14.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/2f6b68d1-eb5c-6a9e-4af3-1b2b131448d7.png">

以下の通り設定し、「次へ」をクリック
サーバーアクセスのログ記録：本番環境ではチェックしたほうが良い
<img width="1680" alt="スクリーンショット 2020-02-02 17.24.54.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/28763caa-fadb-d86d-d4d7-56781b7da45d.png">
<img width="1680" alt="スクリーンショット 2020-02-02 17.25.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/dd53dac6-3d72-d501-4c1b-295e6268b3fa.png">

以下の通り設定し、「次へ」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 17.36.25.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/53ecf967-de69-5798-3a3f-be61ef6da730.png">
<img width="1680" alt="スクリーンショット 2020-02-02 17.37.55.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/4d86a8ce-b4a9-dc02-af3d-4621a1cbea29.png">

設定内容を確認し、「バケットを作成」をクリック
**「パブリックアクセスをすべてブロック」がオフになっていること**
<img width="1680" alt="スクリーンショット 2020-02-02 17.39.58.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/34d3789c-df17-dc78-3feb-d632b42c2d7c.png">
<img width="1680" alt="スクリーンショット 2020-02-02 17.40.52.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/96038685-0e14-460e-2466-2dfd234dcc83.png">

バケットが作成されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-02 17.45.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/fc6d2823-7a23-a0f4-c625-714d05833eb7.png">

## S3操作用のIAMユーザー作成
AWSコンソールからIAMを検索し、クリック
<img width="1680" alt="スクリーンショット 2020-02-02 17.50.02.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/a2a340be-5b9f-5fae-6b88-28df4670bee9.png">

サイドバーから「ユーザー」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 17.53.04.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/55322dcc-9e9c-5245-95c9-cc8becafc788.png">

「ユーザーを追加」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 17.55.40.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/0fb38097-2bf8-13f5-e212-3fcf2862faba.png">

以下の通り設定し、「次のステップ」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 17.58.23.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/c117b1da-00ca-639a-b086-7f5bff42271d.png">

以下の通り設定し、「次のステップ」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 18.03.26.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/5098ee1a-8373-184a-c06c-8964d450100e.png">

タグは設定せず、「次のステップ」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 18.06.23.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/747f1c2e-6044-b29b-9d26-0c61cbc24571.png">

設定内容を確認し、「ユーザーの作成」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 18.07.50.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/a9e32add-d528-0023-e930-ba37a12730d9.png">

**CSVのダウンロードを行うこと**
<img width="1680" alt="スクリーンショット 2020-02-02 18.09.25.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/ec528354-4d3f-dfc2-688c-847271afb786.png">

ユーザーが作成されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-02 18.11.52.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/97594e1d-717c-c63a-fa9c-a2f5646ecb65.png">

## WordPressの設定
### プラグインをインストール
WordPressの管理画面を開く
<img width="1680" alt="スクリーンショット 2020-02-02 19.56.48.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/c1217317-8440-8db6-6c7f-12f847344d08.png">

ログイン
<img width="1680" alt="スクリーンショット 2020-02-02 19.59.13.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/b05aff00-b097-0935-aea5-95e603d4d307.png">

サイドバーのプラグイン　→　新規追加をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 20.00.28.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/c8be1786-70cf-833f-e38a-df0d09069529.png">

WP offload mediaを検索し、「今すぐインストール」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 20.03.47.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/6b44d793-9cac-9238-91cc-c2c12908ff47.png">

「有効化」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 20.05.26.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/a4449e13-b652-06fd-5875-c729d3bd6c55.png">

WP offload mediaが有効化になっていることを確認
<img width="1680" alt="スクリーンショット 2020-02-02 20.06.50.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/af1598fb-b8c1-e491-da50-9de518e0bd43.png">

### ライブラリをインストール
ターミナルからEC2へSSHログイン
`ssh -i test-ssh-key.pem ec2-user@18.179.167.73`

ライブラリをインストール
`sudo yum install -y php-xml`
`sudo yum install -y php-gd`

ライブラリを反映

```
[ec2-user@ip-10-0-10-10 ~]$ sudo systemctl restart httpd.service
```

### プラグインの設定
WordPressの管理画面をリロード
<img width="1680" alt="スクリーンショット 2020-02-02 20.17.42.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/109f806e-ac10-8927-0b52-8bd8fa391ac1.png">

設定　→　Offload Media Liteをクリック
<img width="1680" alt="スクリーンショット 2020-02-02 20.18.48.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/f7f620d5-478a-c69a-4a7f-2e8c683386be.png">

offload mediaの定義情報をコピーしておく
<img width="1680" alt="スクリーンショット 2020-02-02 20.22.35.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/91d0d1ea-108d-5ee4-393c-508d7e562eda.png">

wp-config.phpを開く

```
[ec2-user@ip-10-0-10-10 ~]$ cd /var/www/html/
[ec2-user@ip-10-0-10-10 html]$ ls
index.php        wp-blog-header.php    wp-cron.php        wp-mail.php
license.txt      wp-comments-post.php  wp-includes        wp-settings.php
readme.html      wp-config-sample.php  wp-links-opml.php  wp-signup.php
wp-activate.php  wp-config.php         wp-load.php        wp-trackback.php
wp-admin         wp-content            wp-login.php       xmlrpc.php
[ec2-user@ip-10-0-10-10 html]$ vi wp-config.php
```

wp-config.phpに定義情報を貼り付ける
<img width="1680" alt="スクリーンショット 2020-02-02 20.36.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/34bbfde2-8626-0e4f-0777-3dc399bacd21.png">

**IAMユーザー作成時にダウンロードしたCSVをもとにaccess-key-id,secret-access-keyを入力**

offload mediaのページをリロード
<img width="1680" alt="スクリーンショット 2020-02-02 20.52.33.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/be744458-a5bc-6867-a877-e1a83c1ec93c.png">

「Browse existing buckets」をクリックし
<img width="1680" alt="スクリーンショット 2020-02-02 20.54.58.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/58eb9084-7e66-5526-abe8-4b6908aa2dba.png">

作成したバケットを選択し、「Save Selected Bucket」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 21.14.00.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/02013247-40a8-1218-01c8-c5072a92afd2.png">

設定が保存されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-02 21.16.14.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/feb25fcf-060c-abad-23b9-7872337109b3.png">

「Remove Files From Server」をONに変更し、「Save Changes」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 21.17.56.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/948f274d-34f1-3ed7-e5de-94562e38d83d.png">

### 画像のアップロード
投稿　→　投稿一覧をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 21.26.43.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/c368c290-f2ef-d2e7-0e25-c9891dd1830c.png">

「編集」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 21.28.00.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/76e616e3-de78-a41e-f719-390916e06746.png">

「画像の追加」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 21.30.27.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/1fe0b090-a8d3-045f-b5a1-bebd1d46c40c.png">

画像がアップロードされていることを確認
<img width="1680" alt="スクリーンショット 2020-02-02 21.33.00.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/cf298d8c-4512-57c4-300f-c34ad324aca2.png">

「更新」をクリック
<img width="1680" alt="スクリーンショット 2020-02-02 21.34.47.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/85bd9e23-85fd-b2ef-e17f-4c240d54c500.png">

WordPressのページに画像が表示されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-02 21.36.24.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/e0c88217-7abd-4fb9-11f6-32a92e36f864.png">

AWSコンソールからS3を検索し、クリック
<img width="1680" alt="スクリーンショット 2020-02-02 21.39.26.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/3c9efe77-6ecc-d299-7867-da078f97eb59.png">

対象のバケットをクリック
S3に画像が保存されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-02 21.49.38.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/6c19baac-b8d5-2559-7450-f919da2a6e8a.png">

## CloudFrontから配信
### ディストリビューションの作成
AWSコンソールからCloudFrontを検索し、クリック
<img width="1680" alt="スクリーンショット 2020-02-08 10.24.13.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/f73b157b-9ede-a149-e6f3-e834c6bbd0d1.png">

「Create Distribution」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 10.25.56.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/e8eafaa8-c1bb-656c-099f-7c65dc49a780.png">

WEBの「Get Started」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 10.33.42.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/99c30603-7800-14ee-932f-e98feeb30603.png">

Origin Domain Nameを指定し、「Create Distribution」をクリック
Origin Domain Name：作成したS3
Restrict Bucket Access：CloudFrontのみアクセスする(S3にはアクセスしない)
<img width="1680" alt="スクリーンショット 2020-02-08 11.20.57.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/06c66c66-6b56-6096-a51d-8f5c61763e6c.png">
<img width="1680" alt="スクリーンショット 2020-02-08 11.21.59.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/6380b64e-ed22-baaa-19bf-f8e17a9a62c0.png">
<img width="1680" alt="スクリーンショット 2020-02-08 11.22.16.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/9ff9b74d-02ae-14bf-9ee4-2e283be11be4.png">

ディストリビューションが作成されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-08 11.26.39.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/836aa5dc-3dd4-e598-5323-1bb48eb377f4.png">

## 独自ドメインから配信
### SSLサーバー証明書の発行
ディストリビューションのIDをクリック
<img width="1680" alt="スクリーンショット 2020-02-08 11.29.17.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/df4d48c0-13c4-0632-02bb-416e05f880a1.png">

「Edit」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 11.30.52.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/af84a0a1-af17-3269-fa5b-e81bbb876d16.png">

「Request or Import a Certificate with ACM」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 11.44.42.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/4172e87a-0fda-9083-724d-bc701dd09b95.png">

作成したドメイン名を追加し、「次へ」をクリック
(ドメイン名の前に「*.」を付与することでサブドメインに対応できる)
<img width="1680" alt="スクリーンショット 2020-02-08 12.12.28.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/135c40c8-28d4-d16c-be43-73564a4114ab.png">

「DNSの検証」にチェックを入れ、「次へ」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 12.16.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/b417939d-e17b-6d7d-5166-aea66cdb39e7.png">

タグを任意追加し、「確認」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 12.26.04.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/a4518d0a-9f10-554b-0606-319ce274a876.png">

設定内容を確認し、「確定とリクエスト」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 12.28.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/097eda8c-12b5-bb6a-a5fc-1d5ff14512e5.png">

「Route 53でのレコードの作成」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 12.31.57.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/57fc3425-1752-23a0-1e5c-67e6947daa66.png">

「作成」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 12.33.43.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/0b98c8e5-ccc8-4be2-9467-4750affa602d.png">

適用したドメイン全てのレコードを作成したら、「続行」をクリック
(レコードの名前が同じ場合、レコードの作成は1つで良い)
<img width="1680" alt="スクリーンショット 2020-02-08 12.35.56.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/b5decbb6-a4bb-6782-3118-737a902b55d0.png">

SSLサーバー証明書が発行されたことを確認
<img width="1680" alt="スクリーンショット 2020-02-08 12.40.33.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/bc81c87e-5298-3961-8a28-2cb3e4d660fc.png">

### 独自ドメインを登録
AWSコンソールからCloudFrontを検索し、クリック
ディストリビューションのIDをクリック
「Edit」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 12.46.35.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/ed40b0f8-ff43-6580-1e8a-d300d1fa77a5.png">
<img width="1680" alt="スクリーンショット 2020-02-08 12.47.13.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/fec55c0b-07cb-9274-9efc-3e762ae54ec9.png">

以下の通り入力し、「Yes,Edit」をクリック
Alternate Domain Names：適用したいドメイン名（今回はサブドメイン「static」を付与）
SSL Certificate：「Custom SSL Certificate」にチェックし、発行したSSLサーバー証明書を選択
<img width="1680" alt="スクリーンショット 2020-02-08 12.54.17.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/315f7904-b66b-0080-e551-1b2ffc7b81bb.png">
<img width="1680" alt="スクリーンショット 2020-02-08 12.56.34.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/a88da289-f3b4-6ad5-02dd-d78ab9f42c97.png">

設定内容が反映されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-08 12.59.52.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/38158026-a67c-3a25-651f-315218b576d1.png">

### CNAMEレコードの作成
AWSコンソールからRoute 53を検索し、クリック
ホストゾーンをクリック
対象のドメイン名をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 13.50.39.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/0ca83ce0-8199-a0c6-be3e-14f6dd05b9b9.png">
<img width="1680" alt="スクリーンショット 2020-02-08 13.56.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/cd6f3d82-8ebf-b987-2cbd-057ac96dba42.png">
<img width="1680" alt="スクリーンショット 2020-02-08 13.57.52.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/d92b9871-e911-d7a8-77f4-0b81d724c8ae.png">

「レコードセットの作成」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 14.00.30.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/94a1defd-e649-1f56-3020-8c03b0967fcb.png">

以下の通り設定し、「作成」をクリック
名前：CloudFrontで定義したサブドメイン
タイプ：CNAME
値：CloudFront DistributionのDomain Name
<img width="1680" alt="スクリーンショット 2020-02-08 14.06.36.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/a43394a5-9ae3-c186-34c8-ff3eceff0219.png">

レコードセットが作成されていることを確認
<img width="1680" alt="スクリーンショット 2020-02-08 14.10.44.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/485b7e9c-9437-f8e3-aefc-504c0e1798e5.png">

### Offload Mediaの設定
WordPressの管理画面から設定　→　Offload Media Liteをクリック
<img width="1680" alt="スクリーンショット 2020-02-08 14.18.45.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/46ab3b6a-1ba2-5043-36e8-24d0330b55be.png">

「Custom Domain」をON、CloudFrontで定義したドメイン名を入力し、「Save Changes」をクリック
<img width="1680" alt="スクリーンショット 2020-02-08 14.24.17.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/12dcabf2-f81b-7cc4-0417-b2b1016195ba.png">

設定が保存されたことを確認
<img width="1680" alt="スクリーンショット 2020-02-08 14.40.20.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/397642/2a839a6b-300b-9238-bcc7-4fffaaaf7b02.png">

## 参考
[AWS：ゼロから実践するAmazon Web Services。手を動かしながらインフラの基礎を習得](https://www.udemy.com/course/aws-and-infra/)