プロジェクト内で同じ名前の画像アドレスが変更されました / 画像の更新が間に合わない / その理由

1. 問題分析

1.1. 分析 1 ブラウザキャッシュ

プロジェクト内で同じ名前のイメージ アドレスが変更され、イメージの更新が間に合わなかった。

はブラウザのキャッシュが原因である可能性があります。ブラウザは以前にアクセスしたファイルをキャッシュします。次に同じ名前のファイルにアクセスするときは、そのファイルが最初にキャッシュから読み取られます。
同じ画像アドレスが変更されていない場合、ブラウザはサーバーに再リクエストする代わりに、キャッシュ内の画像を直接使用します。その結果、同じ名前の画像のアドレスが変更された後、ページに表示される画像が更新に間に合わなくなりました。

<img src="image.jpg?v=123456">

非反復パラメータはロードされるたびにランダムに生成されるため、ブラウザはこれを新しいアドレスであるとみなしてキャッシュから読み取らず、サーバーに新しいイメージのダウンロードを再要求します。

1.2. 分析 2 CDN キャッシュ

プロジェクト内で同じ名前のイメージ アドレスが変更され、イメージの更新が間に合わなかった。

画像が CDN 経由で配布されている場合、CDN にも一定のキャッシュ時間が存在するため、ブラウザのキャッシュをクリアするだけでは不十分な場合があります。
同じ名前のイメージ アドレスを変更した場合、CDN 上のキャッシュはすぐには期限切れになりませんが、更新されるまで一定期間待機する必要があります。したがって、同じ名前のイメージのアドレスが変更された後に更新が間に合わない問題を解決するには、CDN キャッシュをクリアする必要があります。

CDN プロバイダーが異なれば、キャッシュのクリア方法も異なる場合があります。ほとんどの CDN プロバイダーは非常に便利なキャッシュ更新ツールを提供しており、更新する URL またはディレクトリを入力して [更新] ボタンをクリックするだけです。一般に、CDN 更新が有効になるまでには一定の時間がかかり、具体的な時間は CDN プロバイダーの更新戦略とキャッシュ時間によって異なります。

1.3. 分析 3 CDN キャッシュ

一部のユーザーがリクエストした写真は新しいもので、一部のユーザーがリクエストした写真は古いものですが、その理由は何ですか?

この状況は、CDN キャッシュが完全に更新されていないことが原因で発生する可能性が高くなります。
同じ名前のイメージ アドレスを変更した場合、CDN 上のキャッシュはすぐには期限切れになりませんが、更新されるまで一定期間待機する必要があります。このプロセス中に、一部のユーザーはキャッシュされた古いイメージを要求する場合があり、一部のユーザーは新しいイメージを要求する場合があります。

この問題を解決するには、CDN キャッシュをクリアして、すべてのユーザーが最新のイメージをリクエストできるようにする必要があります。 CDN プロバイダーによって具体的なキャッシュ クリア方法は異なる場合がありますが、基本的にはキャッシュ更新ツールが提供されており、更新する URL またはディレクトリを入力し、[更新] ボタンをクリックするとキャッシュをクリアできます。 CDN 更新が有効になるまでには一定の時間がかかり、具体的な時間は CDN プロバイダーの更新ポリシーとキャッシュ時間によって異なることに注意してください。

1.4. 分析 4: ブラウザー キャッシュと CDN キャッシュ間の相互作用

同じユーザーが新しいものを表示することもあれば、古いものを表示することもあります。なぜでしょうか?

同じユーザーが異なるタイミングで同じ画像をリクエストし、新しい画像が表示されることもあれば、古い画像が表示されることもある場合は、ブラウザー キャッシュと CDN キャッシュ間の相互作用が原因である可能性があります。

ブラウザが画像をリクエストすると、まず自身のキャッシュにその画像に対応するキャッシュがあるかどうかを確認し、存在する場合はそのキャッシュを直接使用し、サーバーに新たな画像をリクエストしません。 CDN キャッシュの更新時間は比較的長い場合があるため、CDN キャッシュに古いイメージがまだある場合は、ブラウザーのキャッシュが期限切れになる前に、ユーザーには古いイメージが表示されます。

この問題の解決策は、ブラウザのキャッシュをクリアすることです。ユーザーが最新の画像を確実に表示できるようにする場合は、画像アドレスを変更した後、画像アドレスの一部として乱数またはタイムスタンプを追加できます。これにより、ブラウザーと CDN キャッシュの影響を回避し、ブラウザーに強制的な再実行を許可できます。新しい画像をリクエストします。

1.5. CDN にアクセスする分析 5 ノード

同じユーザーが新しいものを表示することもあれば、古いものを表示することもあります。なぜでしょうか?

アクセスした CDN ノードは、ユーザーが表示するコンテンツが新しいか古いかに影響を与える可能性があります。
CDN は、コンテンツをキャッシュすることで Web サイトのアクセス速度を向上させるテクノロジーです。ユーザーの位置に基づいて、最も近い CDN ノードを選択してコンテンツを提供します。
CDN ノードが古いコンテンツをキャッシュしている場合、ユーザーがアクセスすると古いコンテンツが表示される一方、新しいコンテンツをキャッシュする他の CDN ノードは新しいコンテンツをユーザーに提供できます。
したがって、アクセスした CDN ノードは、ユーザーが見るコンテンツが新しいか古いかに一定の影響を与えます。

2. 問題を解決する

2.1. 方法 1

画像アドレス、CDN キャッシュ、CDN トレントを変更するだけです

<img src="image1.jpg">

2.2. 方法 2 

<img src="image.jpg?v=123456">

2.3. 方法 3

強力なキャッシュとネゴシエートされたキャッシュ メカニズムを使用して、ブラウザ キャッシュの有効期間と更新方法を制御できます。​ 

2.4. 方法 4

CDNキャッシュをクリアする

2.5. 方法 5

お急ぎでなければお待ちいただけますよ〜

3. プロセス記録

記録 1. 強力なキャッシュとネゴシエートされたキャッシュ メカニズムを使用して、ブラウザー キャッシュの有効期間と更新方法を制御する方法。

強力なキャッシュとネゴシエートされたキャッシュは、ブラウザーのキャッシュの持続時間とキャッシュの更新方法を制御する 2 つのメカニズムです。

強力なキャッシュ

強力なキャッシュは、応答ヘッダーの Cache-Control フィールドと Expires フィールドを設定することによって実現されます。サーバー側で応答ヘッダーを設定する場合、Cache-Control フィールドと Expires フィールドを設定することで、ブラウザー キャッシュの有効期間と更新方法を制御できます。 Cache-Control フィールドと Expires フィールドが設定されている場合、クライアントがリソースを要求すると、まずこれら 2 つのフィールドを判断してキャッシュを使用するかどうかを決定します。

Expires フィールドは、特定の時点である有効期限を指定します。例: 有効期限: 2023 年 10 月 21 日水曜日 07:28:00 GMT。この時点はサーバー側の時刻であり、現在時刻が有効期限より前の場合、ブラウザはキャッシュを使用し、そうでない場合はサーバーに要求します。

Cache-Control フィールドは HTTP/1.1 で導入され、複数のパラメータを設定してキャッシュの動作を制御できます。より重要なものは次のとおりです。

max-age: キャッシュの最大有効時間を秒単位で指定します。例: Cache-Control: max-age=3600 は 1 時間キャッシュすることを意味します。この時間内にリソースが再度リクエストされた場合、ブラウザはキャッシュを使用します。 public: クライアント キャッシュやプロキシ サーバー キャッシュなど、応答をキャッシュできることを示します。 private: 応答はクライアントのみがキャッシュでき、プロキシ サーバーはキャッシュできないことを示します。

キャッシュをネゴシエートする

キャッシュのネゴシエーションは、応答ヘッダーの Last-Modified フィールドと ETag フィールドを設定することによって実現されます。サーバー側で応答ヘッダーを設定する場合、Last-Modified フィールドと ETag フィールドを設定することで、ブラウザー キャッシュの有効期間と更新方法を制御できます。 Last-Modified フィールドと ETag フィールドが設定されている場合、クライアントがリソースをリクエストすると、まずサーバーにリクエストが送信され、サーバーは If-Modified-Since (Last-Modified の値) と If-None- を使用します。このリクエストの一致。(ETag 値) フィールドがサーバー内のリソースと比較されます。同じであれば、リソースは更新されておらず、キャッシュが使用できることを意味します。そうでない場合は、リソースが更新されたことを意味します、サーバーはリソースのコンテンツを返し、応答ヘッダーの Last-Modified フィールドと ETag フィールドに新しい値を設定します。

強力なキャッシュとネゴシエート キャッシュでは、異なるキャッシュ ヘッダーを設定することでブラウザ キャッシュの有効期間と更新方法を制御でき、実際のアプリケーション シナリオに応じて具体的な設定を調整できます。

記録 2: CDN Torrent を理解する

CDN フラッディングとは、CDN (コンテンツ配信ネットワーク) サーバーが一定期間にわたって大量のリクエストを受信することです。一般的な回避策には次のようなものがあります。

1. CDN サーバーの数を増やす: CDN サーバーの数を増やすと、トラフィックの負荷が分散され、応答速度と安定性が向上します。

2. キャッシュの最適化: CDN キャッシュを最適化すると、サーバーのリクエストが減り、サーバーの負荷と応答時間が短縮されます。

3. ロード バランシングを使用する: ロード バランサーを使用すると、要求をさまざまな CDN サーバーに分散して、CDN フラッドをより適切に処理できます。

4. 電流制限: 1 秒あたりのリクエスト数を制限することで、CDN フラッディングの影響を軽減し、過負荷攻撃から CDN サーバーを保護できます。

5. CDN ベンダーが提供する特別なソリューションを使用する: 一部の CDN ベンダーは、企業が CDN フラッディングなどの問題を解決できるように、適応スケジューラー、予熱、動的防御などを含む特別なソリューションを提供しています。

4. 交換と修正を歓迎します

おすすめ

転載: blog.csdn.net/snowball_li/article/details/134563019