CDNとは：CDNの意味と使う理由、WordPressへの接続方法
CDN（Content Delivery Network）とは、オリジンサーバーのファイルを複数の地域にあるエッジサーバーに保存しておき、訪問者に近いサーバーから応答するコンテンツ配信ネットワークです。エッジサーバーがキャッシュから応答しているかを見るために、jsDelivrのような公開ライブラリ配信サービスのレスポンスヘッダーを確認したところ、jQueryファイルはキャッシュのコピーで応答していました。WordPressに接続するファイルURL変更方式とDNSプロキシ方式は、公式ドキュメントに基づいて比較しました。
1️⃣ CDNの意味：エッジサーバーとオリジンサーバー
POP（Point of Presence）はエッジサーバーがあるデータセンターのことで、訪問者のリクエストは最も近いPOPに届けられます。
リクエストを受けたエッジサーバーは、保存済みのファイルがあればすぐに応答し、なければオリジンサーバーからファイルを取得して応答しながらエッジサーバーに保存します。AWSのCDNであるCloudFrontは、オリジンサーバーから最初のバイトが届いた時点で訪問者への配信を始めます（AWS公式ドキュメント基準）。
エッジサーバーには訪問者がリクエストしたファイルだけが保存されるため、同じファイルでもエッジサーバーごとに最初のリクエストはオリジンサーバーまで届きます。
このようにリクエストが来たときに取得する方式がプル（pull）方式で、ファイルをあらかじめCDNにアップロードしておくプッシュ（push）方式もあります。
2️⃣ CDNを使う理由：距離とオリジンサーバーの負荷
訪問者とサーバーの距離が遠いほど、リクエスト1回の往復時間（RTT）が長くなります。ページを1つ開くとHTMLのほかに画像やCSS、JavaScriptのリクエストも同時に発生するため、近くのエッジサーバーが応答すればリクエストごとに往復時間が短くなります。
エッジサーバーが応答したリクエストはオリジンサーバーまで届かないため、オリジンサーバーのCPU使用量と転送量（帯域幅）も減ります。DNSをCloudflareのプロキシで接続すると、オリジンサーバーのIPが公開されず、DDoS攻撃もCDNで先に遮断されます（Cloudflare公式ドキュメント基準）。
訪問者がオリジンサーバーと同じ地域に集まっているサイトでは、距離から得られる利点は小さくなります。こうしたサイトでは、応答時間の短縮よりもオリジンサーバーの負荷軽減と転送量の削減がCDNのより大きな利点です。
3️⃣ キャッシュされるファイル：静的ファイルとHTML
Cloudflareは初期設定では、ファイル拡張子で決めた画像やCSS、JavaScriptのような静的ファイルだけをキャッシュします（Cloudflare公式ドキュメント基準）。ページのHTMLとJSONは初期設定のキャッシュ対象から外れているため、Cloudflareを接続した後もオリジンサーバーが応答します。
HTMLまでキャッシュするには、CDNでキャッシュルールを別に作る必要があります。このときは、ログインしたユーザーやショッピングカートのように人によって内容が違うページをルールから除外し、ほかの訪問者の画面が混ざらないようにします。
4️⃣ WordPressへの接続：ファイルURL変更とDNSプロキシ
WordPressにCDNを接続するときは、静的ファイルのURLだけをCDNのURLに変えるか、ドメインのDNSをCDNのプロキシに設定してすべてのリクエストがCDNを通るようにします。
| 方式 | 接続する場所 | CDNを通るリクエスト | オリジンサーバーのIP |
|---|---|---|---|
| ファイルURL変更 | キャッシュプラグインのCDN設定にCDNのアドレス（CNAME）を入力 | 画像、CSS、JavaScriptのような静的ファイル | そのまま公開される |
| DNSプロキシ | ドメインのDNSレコードをCDNのプロキシに接続 | サイトへのすべてのHTTP、HTTPSリクエスト | CDNの後ろに隠れる |
ファイルURL変更方式では、 WP Rocket などのキャッシュプラグインのCDN設定に、CDN事業者が提供するアドレス（CNAME）を入力します。入力すると、ページHTML内の画像やCSS、JavaScriptのURLがCDNのURLに変わります（WP Rocket公式ドキュメント基準）。HTMLはオリジンサーバーがそのまま応答します。
DNSプロキシ方式を使うと、ドメインのDNSをCDN事業者が管理することになります。Cloudflareは、ネームサーバーを移さずに既存のDNS事業者にCNAMEレコードを追加するだけでプロキシを接続する方式も提供しています。この方式はBusiness以上のプランでのみ使えます（Cloudflare公式ドキュメント基準）。
5️⃣ キャッシュヒットの確認：cf-cache-statusとageヘッダー
CDNがファイルをキャッシュから応答したかどうかは、レスポンスヘッダーで確認します。以下は、jsDelivrが配信するjQueryファイルのレスポンスヘッダーを確認したコマンドと結果です。
curl -sI https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js | grep -iE "^(cache-control|cf-cache-status|age|server):"cache-control: public, max-age=31536000, s-maxage=31536000, immutable
age: 45920
cf-cache-status: HIT
server: cloudflare[server: cloudflare]はこの応答をCloudflareのエッジサーバーが送ったという表示で、Cloudflareが付ける[cf-cache-status: HIT]はキャッシュから応答したという意味です。[age: 45920]はこのファイルがキャッシュに保存されてから約12時間45分たったという表示です。[max-age=31536000]は1年間保存してよいというオリジンサーバーの指示です。
[HIT]ではなく[MISS]、[DYNAMIC]、[BYPASS]の値が出たときにリクエストがどこまで届くかは、下の図で値のボタンを押して確認できます。
cf-cache-status: HITcf-cache-status: MISScf-cache-status: DYNAMICcf-cache-status: BYPASSCache-Control: no-store または private🔢 FAQ & おすすめコンテンツ
ℹ️ 提携について
当サイトのコンテンツにはアフィリエイトリンクが含まれています。訪問者がこのリンクを通じて商品やサービスを購入すると、当サイトは販売元から手数料を受け取ります。この過程において、購入者が支払う金額（イベント割引適用で金額が下がります↓）は上昇しません。掲載されている価格・割引・在庫情報は作成時点のものであり、実際とは異なる場合がありますので、ご購入前に販売元にて最終確認をお願いいたします。商品の選定および評価は独自の基準に基づいて行われており、手数料の支払いの有無は紹介順や評価内容に影響を与えません。