2026年8月1日

WordPressのメディアURLをCDNに向ける方法

メディア・画像

はじめに

ここでは、WordPressサイトのメディアファイルを効率的に配信するための方法として、コンテンツ配信ネットワーク(CDN)への変更手順について解説します。CDNを利用することで、画像や動画などの大容量データの読み込み時間を短縮し、ウェブサイトのパフォーマンスとユーザーエクスペリエンスを向上させることが可能です。

症状・背景

このテーマが必要になる主な場面:

メディアファイルのアクセスが集中する
サイトのトラフィックが増加し、サーバー負荷が高まる
画像や動画などの大容量メディアファイルを大量に扱う
ユーザーからの高速化要望がある

手順・設定方法

ステップ1: WordPressのメディアファイルをS3バケットへアップロードする

# WP CLIを使用してS3へのバックアップを作成
wp media import s3-bucket --source=local-media-directory --bucket=s3-bucket-name --profile=default --region=ap-northeast-1 --url=https://s3-ap-northeast-1.amazonaws.com/s3-bucket-name

# S3のバケットへメディアファイルを直接アップロード
aws s3 sync local-media-directory/ s3://s3-bucket-name/

ステップ2: CloudflareでS3エージェント設定を行う

# Cloudflareにアカウントログインし、DNS設定の「Workers」セクションへ移動
cf worker create cdn-proxy "import S3 from 'workers-s3';"

# ワークスコッドにS3エージェント設定を追加
export WORKER_NAME="cdn-proxy"
curl -X PUT https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/workers/scripts/$WORKER_NAME \
     -H "Authorization: Bearer $CF_API_TOKEN" \
     -H "Content-Type: application/javascript" \
     --data-binary @cdn-proxy.js

ステップ3: WordPressの設定ファイルを変更してCDN URLを使用する

# wp-config.phpに以下の行を追加または編集
define('WP_CONTENT_URL', 'https://s3-ap-northeast-1.amazonaws.com/s3-bucket-name');
define('WP_PLUGIN_URL',  'https://s3-ap-northeast-1.amazonaws.com/s3-bucket-name/wp-content/plugins');
define('SCRIPT_DEBUG', false);

# .htaccessファイルを編集
RewriteEngine On
RewriteRule ^wp-content/uploads/(.*)$ https://s3-ap-northeast-1.amazonaws.com/s3-bucket-name/$1 [L,NC,R=302]

ステップ4: CDNの設定と監視を行う

# Cloudflareダッシュボードから「Page Rules」を確認し、S3エージェントのURLを指定する
cf page-rule create --target "https://s3-ap-northeast-1.amazonaws.com/s3-bucket-name/*" \
                    --actions 'match="*.example.com/wp-content/uploads/*", proxy="cdn-proxy"'

注意事項

S3バケットへのアクセス権限を適切に設定する
メディアファイルのURLが変更されるため、既存のリンクや参照を更新する
CDN経由での配信はパフォーマンス向上だが、初期コストがかかる場合がある
安全な通信のためにSSL証明書を利用すること
オフライン環境でメディアファイルへのアクセスが必要な場合は、ローカルコピーも維持する

まとめ

1. S3バケットの準備: S3バケットを作成し、必要な権限を設定します。

2. Cloudflareエージェント設定: CloudflareからS3エージェントを使用してメディアファイルを配信する設定を行います。

3. WordPress設定更新: WordPressの設定ファイルや.htaccessでCDN URLを使用するよう変更します。

4. ページルールの設定: Cloudflareダッシュボードから、特定のパスにのみ適用されるページルールを作成します。

5. パフォーマンスとセキュリティ監視: CDN経由でのメディア配信を定期的にチェックし、必要に応じて最適化を行います。

Post Views: 8