Ajax リクエストとブラウザーのキャッシュに関する簡単な説明

以下のエディターでは、Ajax リクエストとブラウザーのキャッシュについて簡単に説明します。編集者はこれが非常に優れていると考えているので、ここで ajax ソース コードを共有し、参考として提供します。 ajax に興味がある場合は、エディターをフォローしてご覧ください

最新の Web アプリケーションでは、フロントエンド コードに大量の Ajax リクエストが溢れています。ブラウザーのキャッシュを Ajax リクエストに使用できる場合、それは大幅に増加します。ネットワーク要求を削減し、プログラムの応答速度を向上させます。

1. Ajax リクエスト

frameworkを使用すると、Ajax リクエストを簡単に作成できます。

$.ajax({
  url : 'url',
  dataType : "xml",
  cache: true,
  success : function(xml, status){  
      }
});

、表示 この式では、現在のリクエストにキャッシュがある場合、そのキャッシュが直接使用されることが必要です。 属性 が false に設定されている場合、Jquery のコメントは次のとおりです: false に設定されている場合、キャッシュを false に設定すると、リクエストされたページも追加されます。クエリ文字列パラメーター「_=[TIMESTAMP]」を URL に追加します。

このように、Ajax リクエストはブラウザーのキャッシュを利用できますか?

これからも見てください。

2. HTTP プロトコル HTTP プロトコルのヘッダー部分は、クライアントがキャッシュを行うべきかどうか、およびキャッシュを行う方法を定義します。詳細については、「14.9 キャッシュ制御」および「14.21 Http ヘッダー フィールド定義の有効期限」を参照してください。簡単な説明は次のとおりです:

Cache-control は、HTTP キャッシュを制御するために使用されます (HTTP/1.0 では部分的に実装されていない可能性があります。Pragma: no-cache のみが実装されています)。データパケット:

キャッシュディレクティブは次のようになります:

| "no-cache"

| "max-stale" [ "=" デルタ秒 ]

| "no-transform"| "only-if -cached "| "キャッシュ拡張子"

re
レスポンスが使用されます:


| "public"
| "private" [ "=" <"> フィールド名 <"> ]
| " キャッシュなし" [ "=" <"> フィールド名 <"> ]
| "ストアなし"

| "max-age" "=" delta-seconds| "s-maxage" "=" delta-seconds| "cache-extension"

説明:


- Public は、応答が可能であることを示します。任意のキャッシュキャッシュにキャッシュされます。

- プライベートは、単一ユーザーの応答メッセージ全体または一部を共有
キャッシュ
できないことを示します。これにより、サーバーは、他のユーザーのリクエストには無効なユーザーからの部分的な応答のみを記述することができます。

-no-store は、重要な情報が意図せずに公開されるのを防ぐために使用されます。リクエスト メッセージで送信すると、リクエスト メッセージと応答メッセージの両方でキャッシュが使用されます。

-max-stale は、クライアントがタイムアウト期間を超えて応答メッセージを受信できることを示します。 max-stale message の値が指定されている場合、クライアントは、タイムアウト期間の指定された値を超える応答メッセージを受信することができます。

Expires はキャッシュの有効時間を表し、クライアントがこの時間より前にリクエストを送信できないようにします。これは max-age の効果と同等です。ただし、同時に存在する場合は、Cache-Control の max-age によって上書きされます。

例: Expires: Thu, 01 Dec 1994 16:00:00 GMT

3. 私の問題

Ajax にキャッシュを true として明示的に追加した後、問題が残ることがわかりました。そのため、サーバー側の問題ではないかと考えました。サーバーは、Restful ベースのサービスを構築するためにジャージを使用していました。コード スニペットは次のとおりです。

@GET
@Produces("application/xml")
public Response getProducts() {
     Response.ResponseBuilder response = Response.ok(data);
     return response.build();
}

添加Cache控制后，进行测试，一切OK。

最后的代码如下：

@GET
@Produces("application/xml")
public Response getProducts() {
     Response.ResponseBuilder response = Response.ok(data);
     // Expires 3 seconds from now..this would be ideally based
     // of some pre-determined non-functional requirement.
     Date expirationDate = new Date(System.currentTimeMillis() + 3000);
     response.expires(expirationDate);
     return response.build();
}