Magento 2におけるCDN・キャッシュクリア完全ガイド（Cloudflare / Fastly / Varnish対応）

Magento (Adobe Commerce) の開発や運用において、Webサイトの表示速度向上やサーバー負荷軽減にCDN（Content Delivery Network）の導入は欠かせません。しかし、ページの更新やデザイン変更が即座に反映されない場合、Magento内部のキャッシュとCDN/リバースプロキシキャッシュの両方を適切にクリアする必要があります。

本記事では、Magentoにおけるキャッシュ管理の仕組みから、環境ごとの効果的なクリア方法、最新の設計手法までを解説します。

1. MagentoとCDNのキャッシュ構造

Magentoのシステムでは、キャッシュが主に2つの階層で保持されています。

• Magento内部キャッシュ (FPC / Full Page Cache): Magento自体が保持するフルページキャッシュです。データベース問い合わせを抑え、レンダリング済みのHTMLを保存します。
• CDN（Fastly, Cloudflare など） / リバースプロキシ（Varnish）: Webサーバーの手前（エッジサーバーやプロキシ層）でHTMLページや静的アセット（画像/CSS/JS）をキャッシュし、ユーザーへ高速配信します。

ページの変更を完全に反映させるには、「Magento内部」と「CDN / プロキシ層」の両方のキャッシュを同期して削除（パージ）する必要があります。

2. Magento管理画面（Admin）からのキャッシュクリア

日常的なコンテンツ更新やメンテナンス時に使用します。

1. 管理画面にアクセス: System ＞ Tools ＞ Cache Management へ移動します。
2. Magento内部キャッシュのクリア:
   • 「Flush Magento Cache」 をクリックすると、Magentoの有効なキャッシュ項目のみが破棄されます（通常はこちらを使用）。
   • 「Flush Cache Storage」 は、同一ストレージ（Redis等）の全データを消去するため、他アプリケーションと共用している場合は注意が必要です。
3. 静的ファイルキャッシュのクリア: 画面下部の 「Flush JavaScript/CSS Cache」 および 「Flush Static Images Cache」 を実行し、生成されたCSS/JSの統合ファイルやリサイズ済み画像キャッシュを消去します。

3. CLI（コマンドライン）からのキャッシュクリア

開発環境やデプロイ自動化（CI/CDパイプライン）の際は、Magento CLIを使用します。

特定のキャッシュタイプのみクリア（推奨）:

bin/magento cache:clean full_page

※ cache:clean は有効なキャッシュタイプのみを安全に削除します。

全キャッシュの破棄:

bin/magento cache:flush

静的ファイル（Static Content）の再生成:
CSSやJSのコード変更を反映させる場合は、生成されたファイルを削除した上で再デプロイします。

rm -rf pub/static/frontend/ pub/static/adminhtml/ var/view_preprocessed/
bin/magento setup:static-content:deploy -f

4. 各CDN・プロキシにおける最新の連携方法

かつて使われていた公式の extension-cloudflare モジュールは Magento 2.2 でサポートが終了 しています。現在利用されている主な構成は以下の通りです。

① Fastly（Adobe Commerce標準）

Adobe Commerce (Cloud) ではFastlyが標準統合されています。Fastlyモジュールを導入することで、商品やページが更新された際に Cache-Tags（Surrogate-Keys） を用いて関連するCDNキャッシュのみをピンポイントで自動パージします。

• 手動操作: Cache Management 内の Fastly 項目から「Purge Fastly Cache by Store」や「Purge All Fastly Content」を実行できます。

② Varnish + Cloudflare 構成（推奨）

現在、Cloudflareを利用する場合は 「VarnishをFPCとして内側に配置し、Cloudflareを手前に置く」 構成が一般的です。

1. Varnish (FPC): Magentoの標準設定でVarnishをFPCとして指定し、Magentoからのタグベース（X-Magento-Tags）の自動パージリクエストを直接Varnishで受け取ります。
2. Cloudflare: 主に画像・CSS/JSなどの静的アセットのキャッシュ、WAF、DDoS保護を担当させます。HTML動的ページはCloudflare側でキャッシュしない（bypass）か、キャッシュルール（Cache Rules）で保持時間を短く設定します。

③ Cloudflare API / カスタム自動パージ

HTMLページもCloudflare上で強力にキャッシュしたい場合は、最新の Cloudflare API v4 に対応したサードパーティ製モジュールを導入するか、Magentoのキャッシュクリアイベント（clean_cache_after 等）をトリガーにしてCloudflare API経由で「Purge by URL」や「Purge Everything」を発行するカスタム実装を行います。

5. キャッシュが反映されない場合のチェックリスト

キャッシュを削除しても変更が反映されない場合は、以下を確認してください。

• ブラウザキャッシュの確認: ローカルブラウザのキャッシュが残っている場合があります。Ctrl + F5（Macは Cmd + Shift + R）でハードリロードするか、シークレットウィンドウで確認します。
• Redis / Varnish の再確認: バックエンドでRedisやVarnishを利用している場合、直接サービス側でパージが実行されているか確認します。
  redis-cli flushall
• Cloudflare「Development Mode」の活用: 開発時や検証時は、Cloudflareの Development Mode をONにして一時的にCDNキャッシュをバイパスし、オリジンサーバーの最新状態が取得できているか切り分けます。
• pub/static のパーミッション確認: コマンド実行後にファイルの所有権（www-data や nginx など）が崩れていると、新しいCSS/JSが配信されずレイアウトが崩れる原因になります。