2026年8月18日

WordPressの画像をAmazon CloudFrontで配信する設定（S3とWP Offload Media Lite）

SEO・パフォーマンス

Amazon CloudFront は AWS の CDN（コンテンツ配信ネットワーク）です。WordPress で使う方法は大きく2つあります。

方法	内容	向いている場面
メディアだけ CloudFront から配信する	アップロードした画像などを S3 に置き、CloudFront 経由で配信する	画像が多い、サーバーの転送量やディスクを減らしたい
サイト全体を CloudFront 経由にする	WordPress のサーバーをオリジンにして、ページも CloudFront を通す	ページ自体の配信を速くしたい。ログインや Cookie の扱いの設計が要る

この記事では、手順が少なく失敗しにくい メディアだけを配信する方法 を説明します。サイト全体を通す方法は WordPressの前にCloudFrontを置く設定を参考にしてください。

画面の名前と設定項目は、2026年11月時点の AWS と WP Offload Media の公式ドキュメントに合わせています。

全体の流れ

S3 バケットを作る（公開アクセスはブロックしたまま）
WordPress 用の IAM ユーザーとアクセスキーを作る
WP Offload Media Lite を入れ、キーを wp-config.php に書く
CloudFront のディストリビューションを作り、OAC で S3 を読ませる
WP Offload Media の配信先を CloudFront にする
必要なら独自ドメイン（例: media.example.com）を付ける

使うプラグインについて

WP Offload Media Lite（wordpress.org のスラッグは amazon-s3-and-cloudfront）は、メディアライブラリにアップロードしたファイルを S3 などのバケットにコピーし、ページ内の URL をバケットや CDN の URL に書き換えるプラグインです。2026年11月時点の版は 3.4.4 で、WordPress 5.9 以上・PHP 8.1 以上が要件です。

無料の Lite 版でできること・できないことは次のとおりです。

機能	Lite	有料版（Pro）
新しくアップロードしたファイルを S3 にコピーし、URL を書き換える	できる	できる
CloudFront を配信先にする（独自ドメインも可）	できる	できる
既存のメディアライブラリをまとめて S3 に移す	できない	できる
CSS・JavaScript・フォントを CDN から配信する（Assets Pull）	できない	できる

既存の画像は Lite では移らず、これまでどおりサーバーから配信されます。

ステップ1：S3 バケットを作る

AWS マネジメントコンソールで S3 を開き、「バケットを作成」を選びます。
バケット名（例: example-wp-media）とリージョン（例: アジアパシフィック（東京）ap-northeast-1）を決めます。
「オブジェクト所有者」は既定の ACL 無効（推奨）、「パブリックアクセスをすべてブロック」はオンのままにします。
「バケットを作成」を選びます。

訪問者は CloudFront だけを通してファイルを読むので、バケットを公開する必要はありません。

ステップ2：IAM ユーザーとアクセスキーを作る

WordPress がバケットに書き込むための IAM ユーザーを作ります。権限は、このバケットに必要な操作だけにします。

IAM コンソールの「ユーザー」で「ユーザーの作成」を選び、名前（例: wp-offload-media）を付けます。コンソールへのアクセスは付けません。作成したユーザーには、次のポリシーをインラインポリシーとして付けます。example-wp-media は自分のバケット名に置き換えます。

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "ObjectLevel",
      "Effect": "Allow",
      "Action": [
        "s3:PutObject",
        "s3:GetObject",
        "s3:DeleteObject"
      ],
      "Resource": "arn:aws:s3:::example-wp-media/*"
    },
    {
      "Sid": "BucketLevel",
      "Effect": "Allow",
      "Action": [
        "s3:GetBucketPublicAccessBlock",
        "s3:GetBucketOwnershipControls",
        "s3:ListBucket",
        "s3:GetBucketLocation"
      ],
      "Resource": "arn:aws:s3:::example-wp-media"
    }
  ]
}

これは WP Offload Media の公式ドキュメントにある最小ポリシーと同じ構成です。パブリックアクセスのブロックと ACL 無効を有効にしたバケットでは、s3:PutObjectAcl は要りません。

続いてアクセスキーを作ります。

作成したユーザーの「セキュリティ認証情報」タブで「アクセスキーを作成」を選び、用途は「AWS の外部で実行されるアプリケーション」を選びます。
表示されたアクセスキー ID とシークレットアクセスキーを控えます。シークレットは後から再表示できません。

WordPress が EC2 上で動いている場合は、アクセスキーの代わりに IAM ロールを使う方法もあります（後述の use-server-roles）。

ステップ3：WP Offload Media Lite を入れ、キーを設定する

「プラグイン」→「プラグインを追加」で「WP Offload Media Lite」を検索し、インストールして有効化します。次に、wp-config.php の「編集が必要なのはここまでです」の行より上に、アクセスキーを書きます。

<?php
define( 'AS3CF_SETTINGS', serialize( array(
	'provider'          => 'aws',
	'access-key-id'     => 'ここにアクセスキーID',
	'secret-access-key' => 'ここにシークレットアクセスキー',
) ) );

キーをプラグインの画面で入力するとデータベースに保存されます。wp-config.php に書くほうが、データベースのバックアップなどからキーが漏れる心配を減らせます。EC2 で IAM ロールを使う場合は、キーの2行の代わりに 'use-server-roles' => true, を書きます。

キーを書いたら、プラグインの設定に進みます。

「設定」→「WP Offload Media」を開き、ストレージの設定で既存のバケット（example-wp-media）を選んで保存します。
Storage Settings の Offload Media（バケットへのコピー）をオンにします。Delivery Settings の Deliver Offloaded Media（URL の書き換え）は、CloudFront を設定するステップ5までオフにしておきます（オンになっていたらオフにして保存します）。

ここまでで、新しくアップロードした画像は S3 にコピーされ、ページではこれまでどおりサーバー上のファイルが表示されます。バケットは非公開なので、この段階で URL を S3 に書き換えると画像が表示されません。

ステップ4：CloudFront のディストリビューションを作る

AWS は、S3 をオリジンにする場合、旧方式の OAI（オリジンアクセスアイデンティティ）ではなく OAC（オリジンアクセスコントロール） を推奨しています。OAC を使うと、CloudFront だけがバケットを読めるようになります。

CloudFront コンソールで「Create distribution」を選びます。
ディストリビューション名を付け、種類は「Single website or app」を選んで進みます。
「Origin type」で Amazon S3 を選び、「Browse S3」でステップ1のバケットを選びます。
「Settings」で Use recommended origin settings を選びます。推奨設定には OAC の作成が含まれます。
AWS WAF の保護を使うかどうかを選び、内容を確認して「Create distribution」を選びます。この流れで作ると、CloudFront が S3 のバケットポリシーを更新します。
状態が「Deploying」から日時の表示に変わったら完了です。d111111abcdef8.cloudfront.net のようなドメイン名を控えます。

S3 の「アクセス許可」タブでバケットポリシーを開くと、次のような内容が入っています。自分で書く場合もこの形です（アカウント ID とディストリビューション ID は自分のものに置き換えます）。

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "AllowCloudFrontServicePrincipalReadOnly",
      "Effect": "Allow",
      "Principal": {
        "Service": "cloudfront.amazonaws.com"
      },
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::example-wp-media/*",
      "Condition": {
        "StringEquals": {
          "AWS:SourceArn": "arn:aws:cloudfront::111122223333:distribution/EDFDVBD6EXAMPLE"
        }
      }
    }
  ]
}

Condition で特定のディストリビューションからの読み取りだけを許可しているので、他人の CloudFront からは読めません。

既存のディストリビューションに後から OAC を付ける場合は、左メニューの「Origin access」で「Create control setting」を選び、署名は「Sign requests (recommended)」、Origin type は S3 で作成します。次にディストリビューションの「Origins」タブで S3 のオリジンを編集し、「Origin access」を Origin access control settings (recommended) にして、作った OAC を選びます。バケットポリシーは上の形に自分で更新します。

ステップ5：WP Offload Media の配信先を CloudFront にする

「設定」→「WP Offload Media」の Delivery Settings を開きます。
Delivery Provider で Amazon CloudFront を選び、「Save Delivery Provider」を選びます。
Use Custom Domain Name (CNAME) をオンにし、ステップ4で控えたドメイン（https:// は付けない。例: d111111abcdef8.cloudfront.net）を入れます。
Deliver Offloaded Media をオンにして保存します。

新しく画像をアップロードし、記事に挿入して表示を確認します。画像の URL が CloudFront のドメインになっていれば設定できています。

wp-config.php で設定する場合は、AS3CF_SETTINGS の配列に 'delivery-provider' => 'aws'（CloudFront を表す値）、'enable-delivery-domain' => true、'delivery-domain' => 'd111111abcdef8.cloudfront.net'、'serve-from-s3' => true（Deliver Offloaded Media）を加えます。定数で決めた項目は、画面からは変えられなくなります。

ステップ6：独自ドメインで配信する（任意）

media.example.com のような自分のドメインで配信する場合の流れです。

AWS Certificate Manager（ACM）で証明書を取る。 CloudFront で使う証明書は、米国東部（バージニア北部）us-east-1 リージョンで発行する必要があります。DNS 検証を選び、表示された CNAME レコードを DNS に登録します。
ディストリビューションに別名を付ける。 ディストリビューションの設定を編集し、「Alternate domain name (CNAME)」に media.example.com を追加し、「Custom SSL certificate」で手順1の証明書を選びます。
DNS に CNAME を登録する。 media.example.com の CNAME を d111111abcdef8.cloudfront.net に向けます。Cloudflare の DNS を使っている場合、このレコードはプロキシしない（DNS only）設定にします。
WP Offload Media の配信ドメインを変える。 Delivery Settings のカスタムドメインを media.example.com に変えて保存します。

動作を確かめる

# CloudFront 経由（200 が返り、x-cache ヘッダーが付く）
curl -sI https://d111111abcdef8.cloudfront.net/wp-content/uploads/2026/11/sample.jpg

# S3 に直接（バケットが非公開なら 403 が返る）
curl -sI https://example-wp-media.s3.ap-northeast-1.amazonaws.com/wp-content/uploads/2026/11/sample.jpg

パスは例です。実際には、記事に入った画像の URL からドメインを除いた部分を使います（年月やバージョンのフォルダーが入ります）。CloudFront 経由のレスポンスにある x-cache が Miss from cloudfront なら初回の取得、同じ URL をもう一度取得して Hit from cloudfront になればキャッシュから配信されています。

注意点

既存の画像は移りません（Lite）。 古い記事の画像は、これまでどおりサーバーの URL のままです。まとめて移すには有料版が要ります。
画像の差し替えとキャッシュ。 WP Offload Media は既定で、バケット内のパスにバージョンを表すフォルダーを付けて、ファイル名の重複とキャッシュの残りを防ぎます（設定名は Add Object Version to Bucket Path）。この設定を切ると、同じ名前のファイルを上書きしたときに古い画像が CloudFront に残ることがあります。その場合は CloudFront の「Invalidations」で対象のパスを無効化します。
ローカルのファイル。 既定ではサーバーにも元のファイルが残ります。「Remove Local Media」（サーバーから削除）をオンにするとディスクは減りますが、S3 から戻す手段を確認してから使ってください。
料金。 S3 の保存容量とリクエスト、CloudFront の転送量などに料金がかかります。最新の料金は AWS の料金ページで確認してください。
キーの管理。 アクセスキーは wp-config.php 以外に置かず、不要になったら IAM で無効化・削除します。

S3 のストレージの基本は Amazon S3ストレージの設定も参考にしてください。

まとめ

メディアだけを CloudFront で配信するなら、S3＋WP Offload Media Lite＋CloudFront の構成が手軽
S3 バケットは非公開のまま、OAC とバケットポリシーで CloudFront だけに読ませる
IAM ユーザーには対象バケットの最小限の権限だけを付け、キーは wp-config.php に書く
Delivery Settings で Amazon CloudFront を選び、配信ドメインを設定する
独自ドメインの証明書は us-east-1 で発行する