AJAX çağrı sonucunun tarayıcı önbelleğe alınmasını önleme

Kullanarak dinamik içerik $.get()yüklersem sonuç tarayıcıda önbelleğe alınır.

QueryString'e rastgele bir dize eklemek bu sorunu çözüyor gibi görünüyor (kullanıyorum new Date().toString()), ancak bu bir hack gibi geliyor.

Bunu başarmanın başka bir yolu var mı? Veya, benzersiz dize bunu başarmak için tek yol, başka herhangi bir öneri ise new Date()?

Kullandığım new Date().getTime()Aynı milisaniye içinde gerçekleşen birden çok istek yoksa çakışmaları önlemek edecek olan:

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

Edit: Bu cevap birkaç yaşında. Hala çalışıyor (bu yüzden silmedim), ancak şimdi bunu başarmanın daha iyi / temiz yolları var . Benim tercihim bu yöntem için, ancak bu yanıt, bir sayfanın ömrü boyunca her istek için önbelleğe almayı devre dışı bırakmak istiyorsanız da yararlıdır .

Aşağıdakiler, hangi jQuery yöntemini kullanırsanız kullanın ($ .get, $ .ajax, vb.) Gelecekteki tüm AJAX isteklerinin önbelleğe alınmasını önleyecektir.

$.ajaxSetup({ cache: false });

JQuery'nin $ .get () sonuçları önbelleğe alınır. Onun yerine

$.get("myurl", myCallback)

önbelleği kapatmanıza izin veren $ .ajax kullanmalısınız:

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

Buradaki tüm yanıtlar, sunucunun erişim günlüklerinde görünecek olan istenen URL'ye ayak izi bırakıyor.

Hiçbir yan etkisi olmayan başlık tabanlı bir çözüme ihtiyacım vardı ve tüm tarayıcılarda Web sayfası önbelleğini nasıl kontrol edebilirim? .

En azından Chrome için çalışan sonuç şöyle olur:

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

başka bir yol, ajax çağrısına yanıt oluşturan kodda sunucu tarafında hiçbir önbellek başlığı vermemektir:

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

Şahsen, sorgu dizesi yönteminin sunucuda üstbilgileri ayarlamaya çalışmaktan daha güvenilir olduğunu hissediyorum - bir proxy veya tarayıcının yine de önbelleğe almayacağının garantisi yoktur (bazı tarayıcılar diğerlerinden daha kötüdür - isim vermeden).

Genellikle kullanıyorum Math.random()ama tarih kullanarak yanlış bir şey görmüyorum (AJAX isteklerini aynı değeri iki kez almak için yeterince hızlı yapmamalısınız).

Belgeleri takip ederek: http://api.jquery.com/jquery.ajax/

cacheözelliği aşağıdakilerle birlikte kullanabilirsiniz :

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

Tabii ki "önbellek kırma" teknikleri işi halledecektir, ancak sunucu istemciye yanıtın önbelleğe alınmaması gerektiğini belirtmişse bu ilk sırada olmaz. Bazı durumlarda, yanıtları önbelleğe almak yararlı olur, bazen değil. Verilerin doğru kullanım ömrüne sunucunun karar vermesine izin verin. Daha sonra değiştirmek isteyebilirsiniz. UI kodunuzdaki birçok farklı yerden sunucudan yapmak çok daha kolay.

Tabii ki sunucu üzerinde kontrolünüz yoksa bu yardımcı olmaz.

GET yerine POST isteği kullanmaya ne dersiniz? (Yine de yapmalısın ...)

Asıl soru, bunun önbelleğe alınmaması için neden ihtiyacınız olduğu. Her zaman değiştiği için önbelleğe alınmaması gerekiyorsa, sunucu kaynağı önbelleğe almamayı belirtmelidir. Sadece bazen değişirse (bağlı olduğu kaynaklardan biri değişebilir) ve istemci kodu bunu bilmenin bir yolu varsa, bazı karma veya son değiştirilme tarihinden hesaplanan URL'ye kukla bir parametre ekleyebilir (Microsoft Ajax komut dosyası kaynaklarında bunu yaparız, böylece sonsuza kadar önbelleklenebilirler, ancak yeni sürümler göründükleri gibi sunulabilirler). İstemci değişiklikleri bilmiyorsa, sunucunun HEAD isteklerini doğru bir şekilde işlemesi ve istemciye önbelleğe alınmış sürümü kullanıp kullanmamasını söylemesinin doğru yolu olmalıdır. Bana rasgele bir parametre eklemek veya istemciden hiçbir zaman önbelleğe almalarını söylememek yanlış görünüyor çünkü önbelleğe alınabilirlik sunucu kaynağının bir özelliğidir ve bu yüzden sunucu tarafında karar verilmelidir. Kendisine sorulması gereken bir başka soru, bu kaynağın gerçekten GET aracılığıyla sunulması mı yoksa POST'tan geçmesi mi? Bu bir anlambilim meselesidir, ancak güvenlikle ilgili etkileri de vardır (yalnızca sunucu GET'in izin verdiği durumlarda çalışan saldırılar vardır). POST önbelleğe alınmayacak.

Belki de bunun yerine $ .ajax () 'a bakmalısınız (eğer jQuery kullanıyorsanız, benziyor). Şuna bir göz atın: http://docs.jquery.com/Ajax/jQuery.ajax#options ve "önbellek" seçeneği.

Başka bir yaklaşım, sunucu tarafında işleri nasıl önbelleğe aldığınıza bakmak olacaktır.

Verilen mükemmel cevaplara küçük bir ek: Javascript olmayan kullanıcılar için ajax olmayan bir yedekleme çözümü ile çalışıyorsanız, bu sunucu tarafı başlıklarını yine de doğru yapmanız gerekir. Vazgeçenleri anlasam da bu imkansız değil;)

Eminim SO size uygun başlıkların tamamını verecek başka bir soru var. Ben tamamen mahkum değil fareler cevap tüm üsleri% 100 kapsar.

Mobil Safari'de cacheseçeneğini kullananlarınız için $.ajaxSetup(), mobil Safari de önbelleğe aldığı için POST'lar için bir zaman damgası kullanmanız gerekebilir. $.ajax()( Üzerinden yönlendirildiğiniz $.ajaxSetup()) belgelerine göre :

Önbelleği false olarak ayarlamak, yalnızca HEAD ve GET istekleriyle doğru şekilde çalışır. GET parametrelerine "_ = {timestamp}" ekleyerek çalışır. Parametre, bir GET tarafından önceden talep edilen bir URL'ye POST yapıldığında IE8 dışında, diğer istek türleri için gerekli değildir.

Dolayısıyla, bu seçeneği tek başına ayarlamak, yukarıda bahsettiğim durumda size yardımcı olmaz.

Temel cache:false;olarak, ilerledikçe içeriğin değişeceğini düşündüğünüz ajax'ı ekleyin . Ve içeriğin değişmeyeceği yer u bunu atlayabilir. Bu şekilde her seferinde yeni yanıt alacaksınız

Internet Explorer'ın Ajax Caching: Bu konuda ne yapacaksınız? üç yaklaşım önerir:

1. Sorgu dizesine? Date = [timestamp] gibi bir önbellek bozma belirteci ekleyin. JQuery ve YUI'de bunu otomatik olarak yapmalarını söyleyebilirsiniz.
2. GET yerine POST kullanma
3. Tarayıcıları önbelleğe almasını özellikle yasaklayan bir HTTP yanıt başlığı gönderin

Şimdi, ajax isteğinizde önbellek seçeneğini etkinleştirerek / devre dışı bırakarak bunu yapmak kolaydır, tıpkı bunun gibi

$(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 kullanıyorsanız, denetleyici sınıfı tanımınızın önünde aşağıdakileri kullanmanız gerekir:

[OutputCache (NoStore = true, Süre = 0, VaryByParam = "*")]

public class TestController: Denetleyici

Bu, tarayıcının önbelleğe alınmasını önleyecektir.

Bu bağlantıdaki ayrıntılar: http://dougwilsonsa.wordpress.com/2011/04/29/disabling-ie9-ajax-response-caching-asp-net-mvc-3-jquery/

Aslında bu benim sorunumu çözdü.

@Athasach'ın dediği gibi, jQuery belgelerine göre, $.ajaxSetup({cache:false}) GET ve HEAD istekleri dışında çalışmayacaktır.

Bir geri göndermeniz daha iyi Cache-Control: no-cacheYine de üstbilgiyi sunucunuzdan . Endişelerin daha net bir şekilde ayrılmasını sağlar.

Tabii ki, bu projenize ait olmadığınız servis URL'leri için işe yaramaz. Bu durumda, üçüncü taraf hizmetini istemci kodundan çağırmak yerine sunucu kodundan proxy yapmayı düşünebilirsiniz.

.Net ASP MVC kullanıyorsanız, bitiş noktası işlevine aşağıdaki özniteliği ekleyerek denetleyici eylemindeki önbelleği devre dışı bırakın:

[OutputCacheAttribute(VaryByParam = "*", Duration = 0, NoStore = true)]

başlık ekle

headers: {
                'Cache-Control':'no-cache'
            }

eklemek Math.random() istek URL'ye