Caching tak terduga dari hasil AJAX di IE8

Saya mengalami masalah serius dengan hasil cache Internet Explorer dari permintaan JQuery Ajax.

Saya memiliki header di halaman web saya yang diperbarui setiap kali pengguna menavigasi ke halaman baru. Setelah halaman dimuat saya melakukan ini

$.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");

Itu hanya menyuntikkan info header ke halaman. Anda dapat memeriksanya dengan membuka www.wikipediamaze.com lalu masuk dan memulai teka-teki baru.

Di setiap browser yang saya uji (Google Chrome, Firefox, Safari, Internet Explorer), ini berfungsi dengan baik kecuali di IE. Semuanya diinjeksi dengan baik di IE pertama kali, tetapi setelah itu bahkan tidak pernah membuat panggilan ke /game/getpuzzleinfo. Ini seperti telah menyimpan hasil atau sesuatu.

Jika saya mengubah panggilan ke $.post("/game/getpuzzleinfo", ...IE mengambilnya dengan baik. Tapi kemudian Firefox berhenti berfungsi.

Bisakah seseorang menjelaskan hal ini tentang mengapa IE melakukan cache $.getpanggilan ajax saya ?

MEMPERBARUI

Sesuai saran di bawah ini, saya telah mengubah permintaan ajax saya menjadi ini, yang memperbaiki masalah saya:

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

IE terkenal karena caching agresif dari respons Ajax. Saat Anda menggunakan jQuery, Anda dapat mengatur opsi global:

$.ajaxSetup({
    cache: false
});

yang akan menyebabkan jQuery menambahkan nilai acak ke string kueri permintaan, sehingga mencegah IE menyimpan respons.

Perhatikan bahwa jika Anda memiliki panggilan Ajax lain yang terjadi di mana Anda ingin menyimpan cache, ini juga akan menonaktifkannya untuk mereka. Dalam kasus tersebut, alihkan untuk menggunakan metode $ .ajax () dan aktifkan opsi itu secara eksplisit untuk permintaan yang diperlukan.

Lihat http://docs.jquery.com/Ajax/jQuery.ajaxSetup untuk info lebih lanjut.

Seperti yang disebutkan di marr75 , GETs di-cache.

Ada beberapa cara untuk mengatasi ini. Selain mengubah header respons, Anda juga dapat menambahkan variabel string kueri yang dibuat secara acak ke akhir URL yang ditargetkan. Dengan cara ini, IE akan menganggapnya sebagai URL yang berbeda setiap kali diminta.

Ada beberapa cara untuk melakukan ini (seperti menggunakan Math.random(), variasi tanggal, dll).

Inilah salah satu cara Anda dapat melakukannya:

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

Gets selalu dapat disimpan dalam cache. Salah satu strategi yang mungkin berhasil adalah mengedit header respons dan memberi tahu klien untuk tidak menyimpan informasi dalam cache atau segera menghentikan cache.

Jika Anda memanggil halaman ashx, Anda juga dapat menonaktifkan caching di server dengan kode berikut:

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

inilah yang saya lakukan untuk panggilan ajax:

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

itu bekerja dengan cukup baik untuk saya.

NickFitz memberikan jawaban yang bagus, tetapi Anda juga harus mematikan caching di IE9. Untuk menargetkan hanya IE8 dan IE9, Anda dapat melakukan ini;

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

Jawaban di sini sangat membantu bagi mereka yang menggunakan jQuery atau karena alasan tertentu langsung menggunakan objek xmlHttpRequest ...

Jika Anda menggunakan proxy layanan Microsoft yang dibuat secara otomatis, ini tidak mudah untuk dipecahkan.

Triknya adalah dengan menggunakan metode Sys.Net.WebRequestManager.add_invokingRequest di event handler, ubah url permintaan:

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

Saya telah membuat blog tentang ini: http://yoavniran.wordpress.com/2010/04/27/ie-caching-ajax-results-how-to-fix/

Baru saja menulis blog tentang masalah ini hanya menggunakan ExtJS ( http://thecodeabode.blogspot.com/2010/10/cache-busting-ajax-requests-in-ie.html )

Masalahnya adalah karena saya menggunakan format penulisan ulang url tertentu, saya tidak dapat menggunakan parameter string kueri konvensional (? Param = value), jadi saya menulis parameter penghilang cache sebagai variabel yang diposting ..... Saya akan berpikir bahwa menggunakan variabel POST sedikit lebih aman daripada GET, hanya karena banyak kerangka kerja MVC menggunakan pola tersebut

protokol: // host / controller / action / param1 / param2

dan pemetaan nama variabel ke nilai hilang, dan parameter hanya ditumpuk ... jadi saat menggunakan parameter perusak cache GET

yaitu protokol: // host / controller / action / param1 / param2 / no_cache122300201

no_cache122300201 dapat disalahartikan sebagai parameter $ param3 yang dapat memiliki nilai default

yaitu

tindakan fungsi publik ($ param1, $ param2, $ param3 = "nilai default") {//..//}

tidak ada kemungkinan hal itu terjadi dengan POSTED cache busters

Jika Anda menggunakan ASP.NET MVC, itu cukup untuk menambahkan baris ini di atas tindakan pengontrol:

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

}

IE berhak melakukan caching ini; untuk memastikan item tidak di-cache, header harus disetel dengan sesuai.

Jika Anda menggunakan ASP.NET MVC, Anda dapat menulis ActionFilter; masuk OnResultExecuted, periksafilterContext.HttpContext.Request.IsAjaxRequest() . Jika demikian, setel header respons yang kedaluwarsa:filterContext.HttpContext.Response.Expires = -1;

Sesuai http://www.dashbay.com/2011/05/internet-explorer-caches-ajax/ :

Beberapa orang lebih suka menggunakan header Cache - Control: no - cache daripada kadaluarsa. Inilah perbedaannya:
Cache-Control: no-cache - benar-benar NO caching
Kedaluwarsa: -1 - browser “biasanya” menghubungi server Web untuk update halaman tersebut melalui permintaan bersyarat If-Modified-Because. Namun, halaman tetap berada di cache disk dan digunakan dalam situasi yang sesuai tanpa menghubungi server Web jarak jauh, seperti saat tombol KEMBALI dan MAJU digunakan untuk mengakses riwayat navigasi atau saat browser dalam mode luring.