防止のたブラウザのキャッシュjQueryのAJAX通話の結果

https://stackoverflow.com/questions/367786

21-08-2019
|

質問

のようになれば負荷動的コンテンツを使用 $.get(), の結果がキャッシュされます。

をランダムな文字列QueryStringうこれらの問題を解決するためを使用してい new Date().toString()このようhack.

あなたの成長はないということだ。す。場合は、独自の文字列にはこの提案の他 new Date()?

解決

私が使う new Date().getTime(), これにより、同じミリ秒内に複数のリクエストが発生しない限り、衝突が回避されます。

$.get('/getdata?_=' + new Date().getTime(), function(data) {
    console.log(data); 
});

編集： この答えは数年前のものです。まだ機能します（したがって削除していません）が、 これを達成するためのより良い/よりクリーンな方法が現在あります. 。私の好みはこれ方法ですが、これキャッシュを無効にしたい場合にも、答えは役立ちます毎ページの存続期間中のリクエスト。

他のヒント

にかかわらず、キャッシュされているから、将来のすべてのAJAX要求を防ぐことができます以下はそのjQueryのメソッドの使用（$に.get、$アヤックス、など。）

$.ajaxSetup({ cache: false });

jQueryの$に.get（）は結果をキャッシュします。代わりの

$.get("myurl", myCallback)

あなたはキャッシュを無効にすることができるようになる、$アヤックスを使用する必要があります：

$.ajax({url: "myurl", success: myCallback, cache: false});

別の方法は、AJAX呼び出しへの応答を生成するコードでは、サーバー側からのキャッシュ・ヘッダーを提供しないことである。

response.setHeader( "Pragma", "no-cache" );
response.setHeader( "Cache-Control", "no-cache" );
response.setDateHeader( "Expires", 0 );

すべての答えがここに残すフットプリントには、要求されたURLを表示するまでのアクセスログはであると考えられる。

そのヘッダに基づく液な側面からの効果から実現できる設定のヘッダに記の制御方法をウェブページのキャッシングは、すべてのブラウザ?.

の結果、クロム、少なくともすることはできない。

$.ajax({
   url: url, 
   headers: {
     'Cache-Control': 'no-cache, no-store, must-revalidate', 
     'Pragma': 'no-cache', 
     'Expires': '0'
   }
});

個人的に私は、クエリ文字列メソッドは、サーバー上のヘッダーを設定しようとするよりも信頼性があることを感じて - プロキシまたはブラウザだけで（一部のブラウザでは、他よりも悪化している - 何の名前を命名しない）とにかくそれをキャッシュしないという保証はありませんます。

私は通常Math.random()を使用するが、私は（あなたが二度同じ値を取得するのに十分な速AJAX要求を行うべきではありません）日付を使用してと間違って何も表示されません。

ドキュメントを以下に示します。 http://api.jquery.com/jquery.ajax/する

あなたがcacheプロパティを使用することができます

$.ajax({
    method: "GET",
    url: "/Home/AddProduct?",
    data: { param1: value1, param2: value2},
    cache: false,
    success: function (result) {
        // TODO
    }
});

もちろん、「キャッシュ・ブレイク」の技術が仕事を得るだろうが、サーバーが応答がキャッシュされるべきでないことをクライアントに示された場合、これは最初の場所で起こりません。いくつかのケースでは、キャッシュレスポンス、いくつかの回ではないに有益です。サーバーがデータの正しい寿命を決定しましょう。あなたは後で変更することもできます。あなたのUIのコード内のさまざまな場所からよりも、サーバーから行うことがはるかに簡単ます。

あなたは、サーバーを制御することはできません場合は、

もちろんこれは役立ちません。

何GETの代わりにPOSTリクエストを使用してについての...？（あなたはどちら...とにかく必要があります）。

あなたは、これはキャッシュされないようにする必要がある理由

本当の問題があります。それはすべての時間を変更するので、それがキャッシュされるべきでない場合は、サーバーはリソースをキャッシュしないように指定する必要があります。それはちょうど、時々変更された場合（資源の一つは、それは変更することができますに依存しているため）、およびクライアントコードはそれについて知る方法を持っている場合、それはいくつかのハッシュまたは最終更新日から計算されたURLにダミーパラメータを追加することができますこれらのリソースの（つまり、彼らは永遠にキャッシュすることができるが、それらは表示され、新しいバージョンはまだ提供することができるので、私たちは、マイクロソフトのAjaxスクリプトリソースで行うものです）。クライアントが変更を知ることができない場合は、正しい方法は適切にHEADリクエストを処理し、キャッシュされたバージョンを使用するかどうかをクライアントに伝えるために、サーバーのためにする必要があります。ランダムなパラメータを追加またはキャッシュ可能性は、サーバーリソースのプロパティであり、そのため、サーバー側決定されるべきであるため、キャッシュが間違っていることはありませんし、クライアントから伝えるように私には思えます。自分自身を依頼するもう一つの問題は、このリソースが本当にGETを介して提供されなければならないですか、それは、POSTを通過する必要がありますか？それは意味論の問題ですが、それはまた、セキュリティへの影響（サーバがGETすることができます場合にのみ機能攻撃がある）を持っています。 POSTはキャッシュされません。

（あなたはそれがどのように見えるのjQueryを使用している場合）

たぶん、あなたは代わりに$アヤックス（）をご覧ください。 http://docs.jquery.com/Ajax/jQuery.ajax：見てみましょう#optionsはとオプションの "キャッシュ" ます。

別のアプローチは、サーバー側で物事をキャッシュする方法を見てすることです。

与えられた優れた答えに小さな加え：あなたはjavascriptを持たないユーザのための非AJAXバックアップソリューションを実行している場合は、あなたはとにかく正しいものを、サーバー側のヘッダを取得する必要があります。私はそれを放棄するものを理解するが、これは、不可能ではありません。）

私はあなたに適切なヘッダのフルセットを与えるように別の質問があります確信しています。私は完全にconviced miceus応答がすべての拠点に100％をカバーしていないです。

モバイルSafariの上cacheの$.ajaxSetup()オプションを使用してあなたのそれらのために、あなたがモバイルSafariはそれもキャッシュすることから、柱のためのタイムスタンプを使用する必要がありますことが表示されます。

：（あなたが$.ajax()からに向けられている）$.ajaxSetup()上の文書によると、

falseにキャッシュを設定するだけHEADで正しく動作して要求を取得します。これは、GETパラメータに「_ = {タイムスタンプ}」を追加することによって動作します。パラメータは、POSTがすでにGETによって要求されたURLに作られてIE8を除き、リクエストの他のタイプには必要ありません。

だから私は、上記のケースであなたを助けにはなりませんだけでそのオプションを設定します。

基本的にはちょうどあなたが進展が上に行くように、コンテンツが変わると思いAJAXでcache:false;を追加します。そして、内容が変更文句を言わない場所uはこれを省略することができます。このように、uが新しい応答を毎回取得します。

Internet Explorer の Ajax キャッシュ:それについてどうするつもりですか? 3 つのアプローチを提案します。

?date=[timestamp] のように、キャッシュ無効化トークンをクエリ文字列に追加します。jQuery と YUI では、これを自動的に行うように指示できます。

GET の代わりに POST を使用する

ブラウザによるキャッシュを特に禁止する HTTP 応答ヘッダーを送信します。

さて、それはちょうどこのように、あなたのAjaxリクエストでキャッシュオプションを無効/有効にすることでそれを行うのは簡単です。

$(function () {
    var url = 'your url goes here';
    $('#ajaxButton').click(function (e) {
        $.ajax({
            url: url,
            data: {
                test: 'value'
            },
                cache: true, //cache enabled, false to reverse
                complete: doSomething
            });
        });
    });
    //ToDo after ajax call finishes
    function doSomething(data) {
        console.log(data);
    }
});

あなたはIE 9を使用している場合は、

、そして、あなたはあなたのコントローラクラスの定義の前に以下を使用する必要があります：

[OutputCache（NOSTORE = trueを、時間= 0、VaryByParam = "*"）

publicクラスTestController：コントローラー

これは、キャッシュからブラウザを防ぐことができます。

このリンク上の

の詳細：ます。http： //dougwilsonsa.wordpress.com/2011/04/29/disabling-ie9-ajax-response-caching-asp-net-mvc-3-jquery/する

実はこれは私の問題を解決します。

@Athasachが言ったように、jQueryのドキュメントによると、$.ajaxSetup({cache:false})は以外では動作しませんGETとHEADリクエストます。

あなたはとにかく自分のサーバーからCache-Control: no-cacheヘッダーを返送したほうが良いです。それは懸念のきれいな分離を提供します。

もちろん、これはあなたのプロジェクトに属さないサービスURLの機能しません。その場合は、サーバーコードからサードパーティのサービスをプロキシするのではなく、クライアントコードから呼び出す検討するかもしれません。

あなたは.NET ASP MVCを使用している場合は、

、エンドポイント機能に次の属性を追加することにより、コントローラのアクションのキャッシュを無効にします。 [OutputCacheAttribute（VaryByParam = "*"、時間= 0、NOSTORE =真）

リクエストURLにMath.random（）を追加

ライセンス： CC-BY-SA と帰属

所属していません StackOverflow