コンピュータ ネットワークに関する注意事項: HTTP プロトコル キャッシングについて

強力なキャッシュ

強力なキャッシュには、HTTP 要求を送信する場合と送信しない場合の 2 つのケースがあります。

最初に強力なキャッシュを確認します。この段階では HTTP リクエストを送信する必要はありません。異なるフィールドを検索することによって行われるため、異なる HTTP バージョンは異なります。

HTTP1.0 バージョンは Expires を使用し、HTTP1.1 は Cache-Control を使用します。

• Expires

Expires は有効期限です. 時間はサーバーの時間に相対的です. サーバーから返された応答ヘッダーに存在します. この有効期限の前に, データは再度要求することなくキャッシュから直接取得できます. 例えば：

Expires:Mon, 29 Jun 2022 11:10:23 GMT

表示该资源在2022年7月29日11:10:23过期，过期时就会重新向服务器发起请求。

このメソッドには問題があるため服务器的时间和浏览器的时间可能并不一致、HTTP1.1 はこれを置き換える新しいフィールドを提案しています。

• Cache-Control

HTTP1.1版ではこのフィールドを使用し、このフィールドで使用する時間はmax-ageに相当する有効期限です。

キャッシュ制御:最大年齢=6000

上記は、リソースが返されてから 6000 秒後にキャッシュを直接使用できることを意味します。

注意点

Expires と Cache-Control が同時に存在する場合、优先考虑Cache-Control. キャッシュ リソースが失敗した場合、つまり強力なキャッシュがない場合は、ネゴシエーション キャッシュに入ります。

ネゴシエーション キャッシュ

強力なキャッシュが失敗すると、ブラウザはリクエスト ヘッダーにレスポンスを含むリクエストをサーバーに送信し、サーバーは缓存Tag対応するキャッシュに従ってtagキャッシュを使用するかどうかを決定します。

Last-Modifiedキャッシュはと の2 種類に分けられますETag。どちらにも利点があります。

• Last-Modified

  • このフィールドは yes を意味します最后修改时间。ブラウザーが初めてサーバーに要求を送信した後、サーバーはこのフィールドを応答ヘッダーに追加します。
  • ブラウザがそれを受信すると、如果再次请求リクエスト ヘッダーにフィールドが含まれますIf-Modified-Since。このフィールドの値は、サーバーから送信された最終変更時刻です。
  • サーバーは、リクエスト ヘッダーのフィールドを取得しIf-Modified-Sinceた後、サーバー内のリソースの最終変更時刻と実際に比較します。リクエスト ヘッダーの値が最終変更時刻よりも小さい場合は、更新する時期であることを意味します。 . 新しいリソースを返すことは、通常の HTTP 要求応答と同じです。それ以外の場合は 304 を返し、ブラウザーにキャッシュを直接使用するように指示します。

• ETag

  • ETagMD5 アルゴリズムなど、現在のファイルのコンテンツに基づいてファイルの一意の識別子を生成するのはサーバーです. 内部のコンテンツが変更される限り、この値は変更されます. サーバーはこのフィールドをブラウザに送信します.応答ヘッダーを介して。
  • ブラウザが値を受け取ると、この値をこのフィールドのコンテンツとしてETag次のリクエストでIf-None-Matchサーバーに送信します。
  • サーバーがそれを受信した後If-None-Match、サーバー上のリソースと比較しますETag. 両者が同じ場合は、直接 304 を返し、キャッシュを直接使用するようブラウザに指示します. HTTP リクエスト応答のプロセスは同じです.

2つを比較する

• 性能上、Last-Modifiedより良い場合ETag、Last-Modified時点が記録され、Etag対応するハッシュ値がファイルの MD5 アルゴリズムに従って生成される必要があります。

• 精度上、ETagよりも優れていますLast-Modified。ETagコンテンツに応じてリソースにラベルを付けると、リソースの変更を正確に認識できますが、Last-Modifiedリソース ファイルの編集などの変更を正確に認識できない場合がありますが、ファイルのコンテンツは変更されていないため、キャッシュ エラーも発生します。Last-Modified 認識できる時間の単位は秒で、1 秒以内に複数回ファイルが変更された場合、Last-Modifiedこの時点では変更が反映されません。

• 最後に、両方の方法がサポートされている場合、服务器会优先考虑ETag.

キャッシュの場所

キャッシュの場所のタイプ、優先度は高いものから低いものへと並べられます: Service Worker—— Memory Cache———Disk CachePush Cache

• Service Worker
  この PWA などのアプリケーション シナリオは、Web Worker の考え方を利用しています. ブラウザ ウィンドウから分離されているため、DOM に直接アクセスすることはできません。オフライン キャッシング、メッセージ プッシュ、ネットワーク プロキシなどの機能を完了できます。オフライン キャッシングには Service Worker Cache があります。

• Memory Cache
  効率的には最も速く、生存時間的には最も短いメモリキャッシュを指し、レンダリング処理が終了すると、メモリキャッシュは存在しません。

• Disk Cache
  ディスクに格納されたキャッシュは、アクセス効率の点でメモリ キャッシュよりも遅く、その利点は格納容量と格納時間にあります。

  Disk Cache Memory Cache2つのVS比較

  • コンテンツの使用率が高い場合、ファイルは最初にディスクに移動します。
  • 大きな JS および CSS ファイルはディスクに直接配置されますが、それ以外の場合はメモリに配置されます。

• Push Cache
推送缓存は、HTTP/2 標準でプッシュ リソースに設定されます。 は、是浏览器缓存的最后一道缓存机制設定されているLast-Modifedが設定されていない場合Cache-Control、Expiresまたは最終更新時刻のみが取得され、有効期限が設定されていない場合にトリガーされます。この場合、ブラウザはデフォルトの缓存策略push cache有効期限が自動的に設定されます。(Date - Last-Modified)*0.1つまり、現在の時刻から最終更新時刻を差し引いてから 10% を掛けた値です。この戦略は只在会话session存在し、セッションが終了すると解放されます。