web-dev-qa-db-ja.com

AJAXの予期しないキャッシュはIE8で発生します

JQuery Ajaxリクエストからの結果をキャッシュするInternet Explorerに深刻な問題があります。

ユーザーが新しいページに移動するたびに更新されるヘッダーがWebページにあります。ページがロードされたら、これを行います

$.get("/game/getpuzzleinfo", null, function(data, status) {
    var content = "<h1>Wikipedia Maze</h1>";
    content += "<p class='endtopic'>Looking for <span><a title='Opens the topic you are looking for in a separate tab or window' href='" + data.EndTopicUrl + "' target='_blank'>" + data.EndTopic + "<a/></span></p>";
    content += "<p class='step'>Step <span>" + data.StepCount + "</span></p>";
    content += "<p class='level'>Level <span>" + data.PuzzleLevel.toString() + "</span></p>";
    content += "<p class='startover'><a href='/game/start/" + data.PuzzleId.toString() + "'>Start Over</a></p>";

    $("#wikiheader").append(content);

}, "json");

ヘッダー情報をページに挿入するだけです。 www.wikipediamaze.com にアクセスしてログインし、新しいパズルを開始することで確認できます。

私がテストしたすべてのブラウザー（Google Chrome、Firefox、Safari、Internet Explorer）では、IEでうまく動作しますexcept。 IE）初めてですべてが正常に注入されますが、その後は/game/getpuzzleinfoを呼び出すことさえありません。結果などをキャッシュしたように。

$.post("/game/getpuzzleinfo", ...への呼び出しを変更すると、IEは問題なくピックアップします。しかし、Firefoxは動作を停止します。

誰かIEが$.get ajax呼び出しをキャッシュしている理由について、これについていくらかの光を当ててください。

[〜＃〜] update [〜＃〜]

以下の提案に従って、私はajaxリクエストをこれに変更し、問題を修正しました：

$.ajax({
    type: "GET",
    url: "/game/getpuzzleinfo",
    dataType: "json",
    cache: false,
    success: function(data) { ... }
});
asp.netjqueryajaxinternet-explorer
135
Micah

IEは、Ajax応答を積極的にキャッシュすることで有名です。 jQueryを使用しているときに、グローバルオプションを設定できます。

$.ajaxSetup({
    cache: false
});

これにより、jQueryがリクエストクエリ文字列にランダムな値を追加し、それによってIEが応答をキャッシュしないようにします。

キャッシングが必要な場所で他のAjax呼び出しが行われている場合は、これらの呼び出しも無効になります。その場合、$。ajax（）メソッドの使用に切り替えて、必要な要求に対してそのオプションを明示的に有効にします。

詳細については、 http://docs.jquery.com/Ajax/jQuery.ajaxSetup を参照してください。

176
NickFitz

marr75 が言及されているように、GETがキャッシュされます。

これに対処するには、いくつかの方法があります。応答ヘッダーの変更とは別に、ランダムに生成されたクエリ文字列変数をターゲットURLの末尾に追加することもできます。このように、IEは、要求されるたびに異なるURLであると見なします。

これを行うには複数の方法があります（Math.random()の使用、日付のバリエーションなど）。

これを行う1つの方法を次に示します。

var oDate = new Date();
var sURL = "/game/getpuzzleinfo?randomSeed=" + oDate.getMilliseconds();
$.get(sURL, null, function(data, status) {
    // your work
});
8
Tom

取得は常にキャッシュ可能です。有効な方法の1つは、応答ヘッダーを編集し、情報をキャッシュしないか、キャッシュをすぐに期限切れにするようにクライアントに指示することです。

3
marr75

Ashxページを呼び出す場合は、次のコードでサーバーのキャッシュを無効にすることもできます。

context.Response.Cache.SetCacheability(HttpCacheability.NoCache);
context.Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
2
Andrej Benedik

これは私がajaxの呼び出しのために行うことです：

var url = "/mypage.aspx";
// my other vars i want to add go here
url = url + "&sid=" + Math.random();
// make ajax call

それは私にはかなりうまくいきます。

1
Jason

NickFitzは良い答えを提供しますが、IE9でもキャッシュをオフにする必要があります。 IE8とIE9のみをターゲットにするには、これを行うことができます。

<!--[if lte IE 9]>
<script>
    $.ajaxSetup({
        cache: false
    });
</script>
<![endif]-->
1
Stuart Hallows

ここでの回答は、jQueryを使用する人、または何らかの理由でxmlHttpRequestオブジェクトを直接使用する人にとって非常に役立ちます...

自動生成されたMicrosoftサービスプロキシを使用している場合、解決するのはそれほど簡単ではありません。

トリックは、イベントハンドラーでSys.Net.WebRequestManager.add_invokingRequestメソッドを使用してリクエストURLを変更することです。

networkRequestEventArgs._webRequest._url = networkRequestEventArgs._webRequest._url + '&nocache=' + new Date().getMilliseconds();

私はこれについてブログに書いています： http://yoavniran.wordpress.com/2010/04/27/ie-caching-ajax-results-how-to-fix/

0
poeticGeek

ASP.NET MVCを使用している場合、コントローラーアクションの上に次の行を追加するだけで十分です。

[OutputCache(NoStore=true, Duration = 0, VaryByParam = "None")]
public ActionResult getSomething()
{

}
0
batmaci

ExtJSのみを使用して、この正確な問題に関するブログを書きました（ http://thecodeabode.blogspot.com/2010/10/cache-busting-ajax-requests-in-ie.html ）

問題は、特定のURL書き換えフォーマットを使用していたため、従来のクエリ文字列パラメーター（？param = value）を使用できなかったため、代わりにキャッシュバスティングパラメーターをポスト変数として記述していたためです..... POST変数を使用すると、GETよりも少し安全になります。多くのMVCフレームワークがパターンを使用しているからです。

protocol：// Host/controller/action/param1/param2

そして、変数名から値へのマッピングは失われ、パラメータは単純に積み重ねられます... GETキャッシュバスターパラメータを使用する場合

すなわち、protocol：// Host/controller/action/param1/param2/no_cache122300201

no_cache122300201は、デフォルト値を持つ可能性がある$ param3パラメーターと間違われる可能性があります

つまり.

public function action（$ param1、$ param2、$ param3 = "デフォルト値"）{//..//}

pOSTEDキャッシュバスターでそれが起こる可能性はありません

0
Ben