WordPress/WooCommerceでHTMLファイルをキャッシュする方法を説明します。
概要
これにより、静的HTMLがエッジでキャッシュできるようになります。リクエストからリクエストへと再生成される必要はありません。
Entterprise Cloudflareのお客様は、カスタムキャッシュキーを使って、パフォーマンスをさらに伸ばすことができます。詳細については、お客様サクセスマネージャーまでお問い合わせください。
前提条件
開始する前に- オリジンWebサーバーからCache-Controlヘッダーを尊重するように設定されていることを確認してください。設定されていない場合、CloudflareがBrowser Cache TTLオプション内で設定された値でCache-Controlヘッダーをオーバーライドする可能性があります。既存ヘッダーを尊重するオプションを設定するには、
1. Cloudflareアカウントにログインします。
2. キャッシングアプリをクリックします。
3.Browser Cache TTLまでスクロールダウンし、「既存ヘッダーを尊重する」を選択します。
Cloudflare Page Ruleで静的HTMLをキャッシュする
1. Cloudflareアカウントにログインします。
2. 次に、サイト上で静的HTMLキャッシングをセットアップするために「Page Ruleを作成」をクリックします。
3. お使いの「WordPressインストール」パスと一致するようにPage Ruleを設定します。 サイトがhttps://www.example.com の場合、ルールは、 https://www.example.comとなります。
- ここでは、https://junade.com で実行されているWordPressを例として使います。そのため、Page Ruleは、https://junade.com/*と一致していなければなりません。
4. 追加のPage Ruleを設定して静的HTMLをキャッシュします：
- Cache Everything(すべてをキャッシュする)がCloudflareに静的HTMLをキャッシュするよう指示を出します。
- Bypass Cache on Cookieが設定された基準を満たす場合、（静的画像とその他のファイルはキャッシュされますが、）CloudflareはTHMLをキャッシュしません。Raw WordPressまたはWooCommerceを使用しているかどうかに応じて、以下の設定一つを使う必要があります。
| WordPress (ネイティブ) | wp-.*|wordpress.*|comment_.* |
| WordPress と WooCommerce | wp-.*|wordpress.*|comment_.*|woocommerce_.* |
- 最後に、Edge Cache TTLの設定で、オリジンWebサーバーからキャッシュされたファイルを戻す前に、Cloudflareがそれを保持できる最長時間を定義します。長いEdge Cache TTL時間を設定した後でも、手動でキャッシュをクリアしたり、自動的にキャッシュパージの管理をするWordPressプラグインを使ったりできます。
5. 保存と展開をクリックして終了します。
さらに、CloudflareのWordPressプラグインにある自動キャッシュ管理機能を使うことで、サイトに変更（例：テーマの変更/カスタムか、投稿、添付ファイルまたはページの削除または作成）を加えた後、サイトへのキャッシュを自動的にージュできるようになります。