9
9

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

WordPressの画像をS3にアップロードしてみた

Posted at

#背景
・Webサーバーのストレージを画像でいっぱいになるのを防ぐ
・HTMLへのアクセスと画像へのアクセスを分けることで負荷分散をする
・画像の保存場所を分けておいた方がスケールアウト(サーバーの台数を増やす)しやすい
・CloudFront(コンテンツ配信サービス)を利用することで画像配信を高速化できる

#目次
1.S3でバケット作成
2.S3を操作するためのIAM作成
3.WordPressのプラグインのインストール(WP→S3に簡単に画像をアップロードするためのプラグイン)
4.プラグインを動かすのに必要なライブラリをEC2にインストール
5.プラグインの設定(WPとS3の連携)

#1.S3でバケット作成
ここでのPoint
・パブリックアクセスをすべてブロックをOFFにしておく。(WPから画像をアップロードするため)

#2.S3を操作するためのIAM作成
1.[ユーザーを追加]→[ユーザー名]の入力、[プログラムによるアクセス]にチェックをつけておく。
2.[既存のポリシーを直接アタッチ]で「S3」と検索し、[AmazonS3FullAccess]をアタッチする。
3.内容を確認し、[ユーザーの作成]を押下。
4.IAMの認証情報CSVファイルをダウンロードしておく。(重要)

#3.WordPressのプラグインのインストール
1.WordPressの管理画面で[プラグイン]→[新規追加]と押下。
2.キーワード検索で「WP offload Media」と入力し、[WP Offload Media Lite for Amazon S3]をインストール→有効化。

#4.プラグインを動かすのに必要なライブラリをEC2にインストール
1.WordPressが入っているWebサーバーにアクセス。
2.以下コマンドで「php-xml」ライブラリをインストール。

$ sudo yum install -y php-xml

3.念のためサーバーの再起動を行っておく。

$ sudo systemctl restart httpd.service

4.念のためEC2インスタンスの再起動も行っておく。
5.WordPressの管理画面から設定→Offload Mdedia Lite を選択。
6.下記図のdifine情報をコピーしておく。
image.png
7.WebServerのConsole画面へ戻り、/var/www/html へ移動する。

$ cd /var/www/html

8.下記図のように任意の箇所にさきほどコピーしておいたdefine情報を貼り付ける。
image.png
9.そして'access-key-id'、'secret-acces-key'にそれぞれに対してIAMユーザー作成の時にダウンロードしたCSVから情報を入力。
10.WordPressの管理画面へ戻り、設定→Offload Mdedia Lite を選択すると以下のような画面になっているので赤枠を選択。
image.png
11.使用するバケットを選び、保存しておく。
image.png
12.選択したバケットになっていればOK。
image.png

---ここまでで投稿ページから画像をアップロードするとS3に保存されるよ
---アップロードした画像のアドレスやS3を確認してみよう!

9
9
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
9

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?