banner
herman

herman

哈哈哈哈哈哈哈哈哈哈哈哈哈哈

Cloudflareでキャッシュルールを設定してWordPressブログを全体的に加速する

まず!

特に感謝!

老头左右天地极限の三人の大御所の助けに感謝します。

このブログの大部分は左右大佬(リンクはこちら)からの引用です hiahia~

前提準備#

・あなたのウェブサイトのドメインは Cloudflare で解析され、プロキシを有効にする必要があります。これは必要条件です。

・Wordpress 上のさまざまなキャッシュプラグインを無効にし、キャッシュをクリアすることをお勧めします。

Page Rules(ページルール)の設定#

Cloudflare の無料プランでは、各ドメインに対して無料で 3 つのページルールを追加できます。Wordpress にはちょうど十分です。他のサイト構築プログラムを使用している場合は、直接コピーしないでください。プログラムのリンクルールに基づいて設定する必要があります。

第一步、Cloudflare のホームページからあなたのドメインを選択し、ドメイン機能インターフェースに入ります。#

第二步、メニュー —— ルール —— ページルールに進み、ページルール設定ページに入ります。#

1701442967859.png

第三步、ページルール作成ボタンをクリックし、合計 3 つのルールを追加します。以下の通りです。#

管理バックエンドルールの設定#

1701442967860.png

| ルール名 | 値 |

| ---------------- | ------------------------------------------------------------ |

| URL | pup.0521.uk/wp-admin/*
注意:この URL はあなた自身のものに変更してください。 |

| ブラウザ完全性チェック | 有効 |

| セキュリティレベル | 高 |

| キャッシュレベル | バイパス |

| IP 地理位置ヘッダー | 有効 |

| 電子メール混乱技術 | 有効 |

重要なのは、キャッシュレベルは必ずバイパスに設定することです。キャッシュレベルは必ずバイパスに設定することです。キャッシュレベルは必ずバイパスに設定することです。さもなければ大変なことになります! |

他の動的ページルールの設定(コメント、検索など)#

1701442967860.png

| ルール名 | 値 |

| ---------------- | ------------------------------------------------------------ |

| URL | pup.0521.uk/*.php
注意:この URL はあなた自身のものに変更してください。 |

| ブラウザ完全性チェック | 有効 |

| セキュリティレベル | 高 |

| キャッシュレベル | バイパス |

| IP 地理位置ヘッダー | 有効 |

| 電子メール混乱技術 | 有効 |

重要なのはキャッシュレベルも必ずバイパスに設定することですが、設定ミスは管理バックエンドルールほど深刻ではありません。

ホームページ、カテゴリ、ページおよび記事ページルールの設定#

1701442967860.png

| ルール名 | 値 |

| ---------------- | ---------------------------------------------- |

| URL | pup.0521.uk/*
注意:この URL はあなた自身のものに変更してください。 |

| ブラウザ完全性チェック | 有効 |

| セキュリティレベル | 高 |

| キャッシュレベル | すべてのコンテンツをキャッシュ |

| エッジキャッシュ TTL | 2 時間 |

| IP 地理位置ヘッダー | 有効 |

| 電子メール混乱技術 | 有効 |

第四步、順序を確認#

作成が完了したら、順序を確認してください!!!

作成が完了したら、順序を確認してください!!!

作成が完了したら、順序を確認してください!!!

1701442967860.png

これで基本的なウェブサイトのページルールが設定されました。この時点で、ウェブサイトのホームページ、カテゴリ、記事などのページが CDN を通じてアクセスできることが保証されます。

ここで小技があります。設定が完了したら、自分でウェブサイトにアクセスしてページをすべてクリックして、ページキャッシュを CDN にトリガーします。実際の訪問者がウェブサイトを閲覧する際に、すぐに開くことができます!

Cache Rules の設定 Cloudflare の無料プランでは最大 3 つのページルールを設定できるため、1 つの静的ページと 2 つの動的ページルールを設定した後は、使用が完了しました。

しかし、ウェブサイトには上記のページ以外にも多くの静的リソース(画像、JS、CSS、フォントなど)があり、これらを毎回ソースサイトから読み込むと、大量の帯域幅を消費します。この時、Cache Rules(キャッシュルール)が役立ちます。

Cloudflare の無料プランでは、各ドメインに対して 10 のキャッシュルールを作成でき、十分すぎるほどです!以下に静的リソースをキャッシュに追加します。

Cache Rules(キャッシュルール)の設定#

第一步、Cloudflare のホームページからあなたのドメインを選択し、ドメイン機能インターフェースに入ります。#

第二步、左側のメニューを展開し、キャッシュ ——Cache Rules をクリックして、キャッシュルール設定ページに入ります。#

1701442967860.png

第三步、ルール作成ボタンをクリック#

ブログのホームページと記事ページのキャッシュ#

1701442967861.png

静的リソースキャッシュ (css/is/woff/html)#

直接編集式をクリックし、以下の内容をそのまま貼り付けてください。

(http.request.uri contains ".css") or (http.request.uri contains ".js") or (http.request.uri contains ".woff") or (http.request.uri contains ".jpg") or (http.request.uri contains ".png") or (http.request.uri contains ".svg") or (http.request.uri contains ".gif") or (http.request.uri contains ".bmp") or (http.request.uri contains ".ico") or (http.request.uri contains ".jpeg")

1701442967861.png

lsky 画像ホスティング - 画像キャッシュ#

自分で画像ホスティングを構築している場合は、画像ホスティングの画像にキャッシュを追加します。時間設定は最大にしてください。

1701442967861.png

これで静的リソースのキャッシュルールが設定されましたが、すぐに有効になるわけではなく、ウェブサイトがアクセスされるにつれて徐々に CDN にキャッシュされます。ページルールと同様の小技として、設定が完了したら、自分でウェブサイトにアクセスしてページをすべてクリックして、ページキャッシュを CDN にトリガーします。実際の訪問者がウェブサイトを閲覧する際に、静的リソースがすぐに読み込まれるようになります!

その他の設定#

Crawler Hints#

Cloudflare を使用してサイトの内容が変更されたとき、Crawler Hints は検索エンジンや他のクローリングプログラムに高品質のデータを提供します。これにより、クローリングプログラムは正確にクロールでき、無駄を避け、同時にソースサーバーや他のインターネットインフラストラクチャのリソース消費を一般的に減少させることができます。

操作パス:キャッシュ —— 設定 ——Crawler Hints

Always Online™#

ソースサーバーが利用できない場合でも、訪問者があなたのウェブサイトにアクセスできるようにします。Cloudflare は Internet Archive の Wayback Machine を通じて限定的なウェブページのコピーを提供します。

操作パス:キャッシュ —— 設定 ——Always Online™

Tiered Cache Topology#

キャッシュトポロジーを選択することで、ソースサーバーと Cloudflare データセンターの接続方法を制御し、キャッシュヒット率を高め、ソースサーバーの接続数を減らし、インターネットの遅延を短縮できます。

操作パス:キャッシュ ——Tiered Cache——Tiered Cache Topology™、Smart Tiered Caching Topology を選択

キャッシュのクリア#

最後に、ウェブサイトのテーマを変更したり、新しいプラグインをインストールしたり、コードを変更したりした場合は、Cloudflare の CDN キャッシュをすぐにクリアすることを強くお勧めします。そうしないと、ウェブサイトが正常に表示されないか、さまざまなエラーが発生する可能性があります。

操作パス:キャッシュ —— 設定、最上部にキャッシュをクリアする操作ボタンがあり、カスタムパスのクリアやすべてのコンテンツのクリアがサポートされています。実際の状況に応じて使用してください。

キャッシュが有効になったかどうかの判断#

F12 を押して開発者ツールを表示し、cf-cache-status の状態を確認します。これが現在のウェブページまたはファイルの CF キャッシュ状態で、HIT が表示されるとキャッシュが成功したことを示します。ブログページを初めて開くと MISS が表示され、F5 を押して更新すると HIT に変わります。

微信图片_20231202225323.png

cf-cache-status の状態には以下のような一般的なものがあります:

  • cf-cache-status——HIT:

    あなたのファイルは CF キャッシュにヒットしました。これは、ユーザーがファイルを取得する方法が CF キャッシュサーバーからであり、あなたのソースサーバーからではないことを示し、あなたのサーバーリソースを消費しません。

  • cf-cache-status——MISS:

    CF はキャッシュサーバーでリクエストされたファイルを探しましたが、見つかりませんでした。CF のキャッシュサーバーはあなたのサーバーに戻ってそのファイルを取得し、次回のリクエスト時にそのファイルは HIT として表示されます。

  • cf-cache-status——BYPASS:

    CF はそのファイルをキャッシュしないように要求されました。ユーザーはウェブサイトのソースサーバーから直接ファイルを取得します。これは通常、リクエストされたファイルが NO-Cache ヘッダーに応答したためです。

  • cf-cache-status——EXPIRED:

    最後のキャッシュからファイルのキャッシュ期限が切れました。CF は再度ウェブサイトのソースサーバーに戻ってファイルを取得します。次回のリクエスト時にそのファイルは HIT として表示されます。

  • cf-cache-status——DYNAMIC:

    このファイルはデフォルトでキャッシュされず、対応するキャッシュ設定もありません。ユーザーはウェブサイトのソースサーバーからそのファイルを取得します。

注意事項#

キャッシュルールを設定したため、例えば 2 時間設定した場合、ブログを更新した後、2 時間後に他の人が最新の記事を見ることができます。つまり、他の人があなたのブログを開くと、2 時間前の内容が表示されます。

したがって、カスタムテーマを作成したり、更新したり、ブログ記事を公開したりする際には、以下の 3 つのルールを無効にし、ブラウザキャッシュをクリアする必要があります。そうしないと、ブログページを開くと更新の遅延が発生します。無効にした後に変更すれば遅延はなく、変更後の状態をリアルタイムで確認できます。

調整が完了したら再度有効にしてください。

  • Page Rules(ページルール)

微信画像_20231203000053.png

  • Cache Rules(キャッシュルール)

微信画像_20231203000132.png

読み込み中...
文章は、創作者によって署名され、ブロックチェーンに安全に保存されています。