コーヒーが好きな木谷映見です。
本記事は、Amazon EC2 インスタンスに WordPress をインストールして Web サイトを作成されている方向けの情報です。
背景
WordPress には WP Offload Media Lite というプラグインがあり、ストレージプロバイダーを Amazon S3 に設定することで画像を S3 バケットに保存することができるようになります。
EC2 インスタンスに設定された WordPress から S3 バケットに画像を保存するには、 EC2 インスタンスから S3 バケットに画像を PUT するための IAM 権限が必要です。
これまでと WordPress 側プラグインの仕様が変わり、IAM ロールを使用するために、本記事に記載する wp-config.php ファイルの設定 が必要になりました。
構成
今回は以下のような構成例で設定します。
Web サーバーとして稼働する EC2 インスタンスに、CMS（コンテンツマネジメントシステム）として WordPress、Web サーバーソフトとして Apache をインストール済み、データベースは RDS for MySQL を利用しています。
現在は画像も EC2 インスタンスに保存しているとします。
WordPress でアップロードする画像を S3 バケットに保存するために、IAM ロールと WordPress の設定を行います。
S3 バケットの設定
今回 S3 バケットは誰でもパブリックにアクセスできるものとします。
オブジェクト所有者の設定から、ACL を有効化します。
S3 バケットポリシーは未設定です。
今回は誰でもアクセスできるブログサイトを想定していますが、ご自身の環境に合わせて適切なポリシー設定をお願いいたします。
IAM ロールの設定
EC2 インスタンスに付与する IAM ロールを作成します。
今回、許可ポリシーは以下のように設定しました。
{
"Version": "2012-10-17",
"Statement": [
{
"Action": [
"s3:GetObject",
"s3:PutObject",
"s3:DeleteObject",
"s3:PutObjectAcl"
],
"Resource": "arn:aws:s3:::(S3 バケット名)/*",
"Effect": "Allow"
},
{
"Action": [
"s3:GetBucketLocation"
],
"Resource": "arn:aws:s3:::(S3 バケット名)",
"Effect": "Allow"
}
]
}
WP Offload Media Lite プラグインのインストール
WordPress に管理者としてログインします。画面左のメニューから [プラグイン] を選択し、[新規追加] をクリックします。
画面右上に検索窓がありますので、「WP Offload Media Lite」と入力し検索します。人間の脳からうさぎが飛び出してきている画像の WP Offload Media Lite がありますので、「今すぐインストール」をクリックします。
インストールが完了したら「有効化」をクリックします。
有効化が完了すると、プラグインの画面に遷移します。
WP Offload Media Lite の「Settings」をクリックします。
次の画面に遷移します。
1.Select Provider で Amazon S3 にチェックが入っているのでこのままにします。
2.Connection Method で 2 番目の「My server is on Amazon Web Services and I'd like to use IAM Roles」にチェックを入れます。
まだ WordPress の wp-config.php ファイルで設定が済んでいないので、Save & Continue をクリックして先に進むことができません。
一旦 WP Offload Media Lite のブラウザ画面はこのまま開いておき、EC2 インスタンスにログインして wp-config.php ファイルの設定をおこないます。
WordPress の設定
Web サーバーにログインし、wp-config.php ファイルを編集します。
今回は ec2-user でログインし、ホームディレクトリ配下で wp-config.php ファイルを編集した後、編集した wp-config.php ファイルを /var/www/html/ 配下にコピーします。
お好みのエディタで wp-config.php ファイルを開きます。
今回は vim を使います。以下のコマンドで wp-config.php ファイルを開きます。
vim wordpress/wp-config.php
i を押下して編集モードに遷移します。
以下のスニペットをコピーし、 wordpress/wp-config.php の先頭の「<?pfp」の後に改行して、貼り付けてください。
define( 'AS3CF_SETTINGS', serialize( array(
'provider' => 'aws',
'use-server-roles' => true,
) ) );
esc を押下して編集を終了、:wq を入力、Enter を押下して編集を保存します。
以下のコマンドを入力し、wordpress/wp-config.php ファイルを /var/www/html/ にコピーします。
sudo cp wordpress/wp-config.php /var/www/html/
上記操作が完了したら、開いておいた WP Offload Media Lite のブラウザ画面を再読み込みします。
先ほどまで表示されていた警告が消え、Save & Continue で先に進むことができます。
※再読み込みすると、その次の Bucket ページが表示されているかもしれません。
Bucket ページが開きます。
New or Existing Bucket? で「Use Existing Bucket」が選択されており、
Select Bucket で「Enter bucket name」が選択されていることを確認したら、BUCKET NAME に自身の S3 バケット名を入力します。
バケット名を入力したら、「Save Bucket Settings」をクリックします。
Security ページが開きます。
何も変更せず、「Keep Bucket Security As Is」をクリックします。
これで、設定は完了となります。
試しに、私が大好きでコーヒーのお供にぴったりなクリスピークリームドーナツの写真をアップロードしてみましょう。
画面左のメニューから「メディア」を選択し、お好みの画像をドラッグアンドドロップでアップロードします。
アップロードした画像を開いて確認すると、Storage Provider が Amazon S3 となっており、設定した S3 バケット名が表示されているのが確認できました。
ファイルの URL も S3 バケットの URL が表示されています。
おわりに
EC2 インスタンスに IAM ロールを設定し、S3 バケットに画像を保存する設定をおこないました。 今回の構成は弊社でリリースしております Udemy 教材で詳しい構築手順をご案内しておりますので、ぜひ試してみてください。
また、SCSK 木澤様によるこちらのブログも大変参考にさせていただきましたので、ご紹介いたします。ぜひ合わせてご参照ください。
blog.usize-tech.com
参考
emi kitani(執筆記事の一覧)
AS部LX課。2022/2入社、コーヒーとサウナが好きです。執筆活動に興味があります。AWS認定12冠。
