在之前的文章(10 個WordPress網站工程師必知的外掛 – WP Offload S3 上篇)我們提到介紹了WP Offload S3 外掛以及將圖片放在 S3 上面的優點,這一篇我們將會告訴大家如何安裝並且設定 WP Offload S3 讓網站的圖片跟檔案都從 AWS S3 載入。
1. 建立AWS S3 Bucket
你必須要先有一個 AWS 的帳號,在有了帳號之後您可以進到 AWS S3 的介面 https://s3.console.aws.amazon.com/s3/ 來建立一個 bucket,這個 bucket 將會儲存您網站的所有圖片並且為您的網站提供圖片下載的功能,建立 bucket 的步驟如下:
- 建立一個新的 Bucket

2. 設定 bucket名稱以及 bucket region
Bucket 名稱建議選擇跟網站相關,Region 則是選離自己伺服器最近的 Region,之前通常都會選東京或是新加坡,但是現在台灣也有 AWS 的資料中心了,所以也可以選擇台灣

3. 設定 Bucket Object Ownership
在 Object Ownership 區塊要確認一下設定為 ACLs enabled,S3 Offload 會需要使用到 ACLs

4. 設定 Bucket 權限
Block all public access 預設會是勾選的,請取消勾選

5. 建立 Bucket
其他的設定像是 Bucket Versioning 以及 Tags 您可以根據自己的需求來做設定,確認設定沒問題好可以按 "Create Bucket" 按鈕建立 Bucket,完成後您應該就可以看到 Bucket 在清單裡面了。
6. 建立一個IAM 使用者
建立完 S3 bucket 之後我們必須建立一個 IAM 使用者給 S3 Offload 外掛使用,這個使用者的功能是在讓外掛可以有權限可以在 S3 上傳或是刪除檔案。
- 從AWS的主頁面連結進到 IAM Users 頁面,或是直接點選https://console.aws.amazon.com/iam/home#users
- 點取新增使用者,在使用者名稱欄位下輸入使用者名稱(eg. innovext-s3-user)
- 在訪問類型(access type)選取編程訪問(Programmatic access),按下一步。
- 按下一步審核,按下建立使用者連結。
- 使用者建立後你會看到 AWS 幫我們建立了 Access Key ID 跟 Secret Access Key,我們要把這兩個參數記下來,尤其是 Secret Access Key,AWS 不會再提供給我們第二次,如果我們遺失了這個 key 我們必須重新申請一組 access key。
- 將這組 Access key 放在 wp-config.php 的 最後面即可。
define( 'AS3CF_AWS_ACCESS_KEY_ID', '********************' );
define( 'AS3CF_AWS_SECRET_ACCESS_KEY', '************************************' );7. 設定IAM使用者的S3權限
新增的 IAM 使用者預設是沒有任何權限的,所以我們為剛剛設定的使用者加上S3的權限
- 從 AWS 的主頁面連結進到 IAM Users 頁面 (您應該會看到你的使用者列表,剛剛建立的使用者也應該要在列表裡面)
- 點選我們剛剛建立的使用者,你應該會看到一個權限(premission)的標籤,
- 在右下角你應該會看到一個 Add inline policy,點選這個按鈕。
- 提供給 Policy 一個名稱,選取 JSON ,並將下方的內容貼到 Policy Editor 的格子內(需取代 Bucket 名稱),然後按儲存就可以了。
{
"Version": "2012-10-17",
"Statement": [
{
"Effect": "Allow",
"Action": [
"s3:CreateBucket",
"s3:DeleteObject",
"s3:Put*",
"s3:Get*",
"s3:List*"
],
"Resource": [
"arn:aws:s3:::{YOUR-BUCKET-NAME}",
"arn:aws:s3:::YOUR-BUCKET-NAME/*"
]
}
]
}8. 安裝並且設定 WP Offload S3
以上基本上 AWS 的設定就完成了,接下來就是要設定 WP Offload s3 的部分,安裝的部分我們就不詳述了,請到外掛頁面並且搜尋安裝 WP Offload S3,設定的方式我覺得最快是直接將設定寫在 wp-config.php ,以下是設定的範例 (加到 wp-config.php 裡)
define('AS3CF_SETTINGS', serialize(array(
'provider' => 'aws',
'access-key-id' => '你的 IAM Role Access Key ID',
'secret-access-key' => '你的 IAM Role Secret Access Key',
'bucket' => '你的 S3 BUCKET 名稱',
// Automatically copy files to S3 on upload
'copy-to-s3' => true,
// Rewrite file URLs to S3
'serve-from-s3' => true,
// Delivery Provider ('storage', 'aws', 'do', 'gcp', 'cloudflare', 'keycdn', 'stackpath', 'other')
'delivery-provider' => 'aws',
// Enable object prefix, useful if you use your bucket for other files
'enable-object-prefix' => true,
// Object prefix to use if 'enable-object-prefix' is 'true'
'object-prefix' => 'assets/',
// Organize S3 files into YYYY/MM directories
'use-yearmonth-folders' => true,
// Serve files over HTTPS
'force-https' => true,
// Remove the local file version once offloaded to S3
'remove-local-file' => false,
// Append a timestamped folder to path of files offloaded to S3
'object-versioning' => false,
)));9. 測試上傳圖片
恭喜!這樣就設定完成了,接下來請到媒體庫試著上傳圖片到網站上,如果設定成功的話你應該可以在檔案資料的右邊看到類似下面的資訊,這就代表以後您的網站圖片都將由 s3 來提供!!

結論
S3 Offload 相關的設定還有很多,這篇文章只是將最常用最簡單的設定拿出來跟大家分享。
如果大家對於這個外掛有其他問題可以到他們的官網看他們的使用說明,有任何外掛使用上的問題也歡迎聯絡我們喔。
因創科技所製作和維護的網站都會幫您主動安裝以及設定 S3 Offload,希望我們的用心可以讓你們的網站可以更傑出並且為你們帶來最好的效益。
