Tarayıcıyı önbelleği temizlemeye zorla

Bir siteyi ziyaret ettiğinde, tarayıcı önbelleğini temizleyerek değişiklikleri görüntüleyebilmeleri için sayfama kod yazabilmemin bir yolu var mı?

Kullanılan diller: ASP.NET, VB.NET ve elbette HTML, CSS ve jQuery.

Bu yaklaşık olarak değişir .cssve .jsdeğişiyorsa, "önbellek bozma" nın bir yolu _versionNoher sürüm için dosya adına " " gibi bir şey eklemektir . Örneğin:

script_1.0.css // This is the URL for release 1.0
script_1.1.css // This is the URL for release 1.1
script_1.2.css // etc.

Veya alternatif olarak dosya adından sonra yapın:

script.css?v=1.0 // This is the URL for release 1.0
script.css?v=1.1 // This is the URL for release 1.1
script.css?v=1.2 // etc.

Nasıl çalışabileceğini görmek için bu bağlantıya göz atabilirsiniz.

İçine bak önbellek kontrol ve sona META Tag.

<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="EXPIRES" CONTENT="Mon, 22 Jul 2002 11:12:01 GMT">

Diğer bir yaygın uygulama, istenen dosyaların sonuna sürekli değişen dizeler eklemektir. Örneğin:

<script type="text/javascript" src="main.js?v=12392823"></script>

2012 Güncellemesi

Bu eski bir soru ama daha güncel bir cevaba ihtiyacı olduğunu düşünüyorum çünkü şimdi web sitesi önbellekleme daha fazla kontrol sahibi olmanın bir yolu var.

Gelen Çevrim Web Uygulamaları (gerçekten herhangi bir HTML5 web sitesidir)applicationCache.swapCache() elle sayfayı yeniden gerek kalmadan web önbelleğe alınmış sürümünü güncellemek için kullanılabilir.

Bu, Başlangıç ​​Kılavuzu'ndaki HTML5 Kayalarında Uygulama Önbelleğini Kullanma Kılavuzu'nda kullanıcıların sitenizin en yeni sürümüne nasıl güncelleneceğini açıklayan bir kod örneğidir :

// Check if a new cache is available on page load.
window.addEventListener('load', function(e) {

  window.applicationCache.addEventListener('updateready', function(e) {
    if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
      // Browser downloaded a new app cache.
      // Swap it in and reload the page to get the new hotness.
      window.applicationCache.swapCache();
      if (confirm('A new version of this site is available. Load it?')) {
        window.location.reload();
      }
    } else {
      // Manifest didn't changed. Nothing new to server.
    }
  }, false);

}, false);

Ayrıca bkz . Uygulama önbelleğini kullanma fazla bilgi için bkz. Mozilla Developer Network'te .

Güncelleme 2016

Web'de işler hızla değişiyor. Bu soru 2009'da soruldu ve 2012'de soruda açıklanan sorunu ele almanın yeni bir yolu hakkında bir güncelleme yayınladım. 4 yıl daha geçti ve şimdi zaten kullanımdan kaldırılmış gibi görünüyor. Cgaldiolo'ya teşekkürler için .

Şu anda, Temmuz 2016 itibarıyla HTML Standardı, Bölüm 7.9, Çevrimdışı Web uygulamaları bir kullanımdan kaldırma uyarısı içeriyor:

Bu özellik Web platformundan kaldırılma aşamasındadır. (Bu uzun yıllar süren uzun bir süreçtir.) Şu anda çevrimdışı Web uygulaması özelliklerinden herhangi birinin kullanılması kesinlikle önerilmez. Bunun yerine servis çalışanlarını kullanın.

Yani yapar Uygulama önbelleği kullanmak ben 2012 yılında başvurulan bu Mozilla Geliştirici Ağı:

Kullanımdan
kaldırıldı Bu özellik Web standartlarından kaldırılmıştır. Bazı tarayıcılar yine de destekleyebilse de, bırakılma aşamasındadır. Eski veya yeni projelerde kullanmayın. Bunu kullanan sayfalar veya Web uygulamaları her zaman kırılabilir.

Ayrıca bkz. Hata 1204581 - Hizmet çalışanı getirme müdahalesi etkinse AppCache için bir kullanımdan kaldırma bildirimi ekleyin .

Öyle değil. Bir yöntem, tarayıcıyı yeniden yüklemeye zorlamak için içerik yayınlarken uygun başlıkları göndermektir:

Bir web sayfasının tüm tarayıcılarda önbelleğe alınmadığından emin olun.

İçin arama "cache header" veya SO'daki benzer bir şey ASP.NET'e özgü örnekler bulacaksınız.

Sunucu tarafında üstbilgileri denetleyemiyorsanız, daha az temiz ama bazen tek yol, çağrılan kaynağa rastgele bir GET parametresi eklemektir:

myimage.gif?random=1923849839

İçin statik kaynaklara doğru önbelleğe alma olacaktır sorgu parametreleri kullanmak her dağıtım veya dosya sürümü değeriyle. Bu, her dağıtımdan sonra önbelleği temizleme etkisine sahip olacaktır.

/Content/css/Site.css?version={FileVersionNumber}

İşte ASP.NET MVC örneği.

<link href="@Url.Content("~/Content/Css/Reset.css")?version=@this.GetType().Assembly.GetName().Version" rel="stylesheet" type="text/css" />

Montaj sürümünü güncellemeyi unutmayın.

Benzer bir sorunum vardı ve bunu şu şekilde çözdüm:

1. Gelen index.htmldosyanın ben apaçık ekledik:

   <html manifest="cache.manifest">

2. In <head>bölümünde komut önbelleği güncelleme dahil:

   <script type="text/javascript" src="update_cache.js"></script>

3. In <body>bölümünde ben işlevi onload ekledikten:

   <body onload="checkForUpdate()">

4. Gelen cache.manifesttüm dosyalar koyduk Ben cache istiyorum. Şimdi benim durumumda (Apache) sadece "sürüm" yorum her zaman güncelleyerek çalışması önemlidir. Ayrıca, dosyaları "? Ver = 001" veya adın sonunda bir şeyle adlandırmak için bir seçenektir, ancak gerekli değildir . Değiştirme yalnızca # version 1.01önbellek güncelleme olayını tetikler.

   CACHE MANIFEST
   # version 1.01
   style.css
   imgs/logo.png
   #all other files

   Yalnızca index.html dosyasına 1., 2. ve 3. noktaları dahil etmek önemlidir . Aksi takdirde

   GET http://foo.bar/resource.ext net::ERR_FAILED

   her "alt" dosya, sayfa önceden önbelleğe alınırken sayfayı önbelleğe almaya çalıştığı için oluşur.

5. Gelen update_cache.jsdosyanın Bu kodu hazırladık:

   function checkForUpdate()
   {
       if (window.applicationCache != undefined && window.applicationCache != null)
       {
           window.applicationCache.addEventListener('updateready', updateApplication);
       }
   }
   function updateApplication(event)
   {
       if (window.applicationCache.status != 4) return;
       window.applicationCache.removeEventListener('updateready', updateApplication);
       window.applicationCache.swapCache();
       window.location.reload();
   }

Şimdi dosyaları değiştiriyorsunuz ve manifest'te sürüm yorumunu güncellemelisiniz. Şimdi index.html sayfasını ziyaret ettiğinizde önbellek güncellenecektir.

Çözümün parçaları benim değil ama onları internet üzerinden buldum ve işe yarayacak şekilde bir araya getirdim.

Çevrimiçi müşterilerin fotoğraflarını çekeceğim ve bir fotoğraf değiştirilirse div'i güncellemem gereken bir durum vardı. Tarayıcı hala eski fotoğrafı gösteriyordu. Bu yüzden her seferinde benzersiz olacak rastgele bir GET değişkeni çağırma hackini kullandım. İşte kimseye yardım ederse

<img src="/photos/userid_73.jpg?random=<?php echo rand() ?>" ...

DÜZENLEME Başkaları tarafından işaret edildiği gibi, görüntüleri yalnızca değiştirildiklerinde yeniden yükleyeceği için bu çok daha verimli bir çözümdür ve bu değişikliği dosya boyutuna göre tanımlar:

<img src="/photos/userid_73.jpg?modified=<? filemtime("/photos/userid_73.jpg")?>"

Pek çok cevap eksik - çoğu geliştirici önbelleği kapatmanın verimsiz olduğunun farkında. Ancak, verimliliğin önemsiz olduğu ve varsayılan önbellek davranışının kötü bir şekilde bozulduğu birçok yaygın durum vardır.

Bunlar, iç içe geçmiş yinelemeli komut dosyası sınamalarını (büyük olanı!) Ve bozuk üçüncü taraf yazılım çözümlerini içerir. Burada verilen çözümlerin hiçbiri bu tür ortak senaryoları ele almak için yeterli değildir. Çoğu web tarayıcısı çok agresif önbellekleme özelliğine sahiptir ve bu sorunları önlemek için hiçbir mantıklı yöntem sunmamaktadır.

<meta http-equiv="pragma" content="no-cache" />

Ayrıca bkz. Https://stackoverflow.com/questions/126772/how-to-force-a-web-browser-not-to-cache-images

URL'yi aşağıdaki şekilde güncellemek benim için çalışıyor:

/custom.js?id=1

Kullanıcılara benzersiz bir sayı ekleyerek ?id=ve yeni değişiklikler için bu sayıyı artırarak kullanıcıların CTRL + F5önbelleği yenilemek için basmaları gerekmez . Alternatif olarak, geçerli zamanın karma veya dize sürümünü veya Sonrasındaki eki ekleyebilirsiniz.?id=

Gibi bir şey ?id=1520606295

İşte ASP.NET önbelleği ayarlama hakkında MDSN sayfası.

Response.Cache.SetExpires(DateTime.Now.AddSeconds(60))
Response.Cache.SetCacheability(HttpCacheability.Public)
Response.Cache.SetValidUntilExpires(False)
Response.Cache.VaryByParams("Category") = True

If Response.Cache.VaryByParams("Category") Then
   '...
End If

Bunun gerçekten size yardımcı olup olmayacağından emin değilim, ancak önbelleklemenin herhangi bir tarayıcıda böyle çalışması gerekir. Tarayıcı bir dosya istediğinde, "çevrimdışı" mod olmadığı sürece her zaman sunucuya bir istek göndermesi gerekir. Sunucu, değiştirilme tarihi veya etags gibi bazı parametreleri okuyacaktır.

Sunucu DEĞİŞTİRİLMEDİ için 304 hata yanıtı döndürür ve tarayıcının önbelleğini kullanması gerekir. Etag sunucu tarafında doğrulanmazsa veya değiştirilen tarih geçerli değiştirilme tarihinin altındaysa, sunucunun yeni içeriği değiştirilen tarih veya etags veya her ikisiyle birlikte döndürmesi gerekir.

Tarayıcıya gönderilen önbellek verisi yoksa, davranışın belirsiz olduğunu düşünüyorum, tarayıcı nasıl önbelleğe alındıklarını söylemeyen önbellek dosyası olabilir veya olmayabilir. Yanıtta önbellek parametrelerini ayarlarsanız, dosyalarınız doğru bir şekilde önbelleğe alınır ve sunucu bir 304 hatası veya yeni içerik döndürmeyi seçebilir.

Bu böyle yapılmalı. URL'lerde rastgele parametreler veya sürüm numarası kullanmak, her şeyden çok bir hack gibidir.

http://www.checkupdown.com/status/E304.html http://en.wikipedia.org/wiki/HTTP_ETag http://www.xpertdeveloper.com/2011/03/last-modified-header-vs- sona-başlığını-vs-ETAG'ın /

Okuduktan sonra da bir son kullanma tarihi olduğunu gördüm. Sorun yaşıyorsanız, bir son kullanma tarihi geçmiş olabilir. Başka bir deyişle, tarayıcı bir son kullanma tarihi olduğu için dosyanızı önbelleğe alacağı zaman, bu tarihten önce tekrar istemesi gerekmez. Başka bir deyişle, dosyayı asla sunucuya sormayacak ve hiçbir zaman değiştirilmemiş bir 304 almayacaktır. Son kullanma tarihine ulaşılana veya önbellek temizlenene kadar önbelleği kullanacaktır.

Bu benim tahminim, bir tür son kullanma tarihiniz var ve son değiştirilmiş etags veya bunların bir karışımını kullanmalı ve son kullanma tarihi olmadığından emin olmalısınız.

İnsanlar çok fazla yenileme eğilimi gösterirse ve dosya çok fazla değişmezse, büyük bir son kullanma tarihi ayarlamak akıllıca olabilir.

2 sentim!

Benim için çalışan bu basit çözümü (henüz üretim ortamında değil) uyguladım:

function verificarNovaVersio() {
    var sVersio = localStorage['gcf_versio'+ location.pathname] || 'v00.0.0000';
    $.ajax({
        url: "./versio.txt"
        , dataType: 'text'
        , cache: false
        , contentType: false
        , processData: false
        , type: 'post'
     }).done(function(sVersioFitxer) {
        console.log('Versió App: '+ sVersioFitxer +', Versió Caché: '+ sVersio);
        if (sVersio < (sVersioFitxer || 'v00.0.0000')) {
            localStorage['gcf_versio'+ location.pathname] = sVersioFitxer;
            location.reload(true);
        }
    });
}

Html nerede bulunur küçük bir dosya var:

"Versio.txt":

v00.5.0014

Bu işlev tüm sayfalarımda çağrılır, bu yüzden yüklerken localStorage'ın sürüm değerinin geçerli sürümden düşük olup olmadığını kontrol eder ve

location.reload(true);

... önbellek yerine sunucudan yeniden yüklemeyi zorlamak için.

(açıkçası, localStorage yerine çerezleri veya diğer kalıcı istemci depolarını kullanabilirsiniz)

Bu çözümü basitliği nedeniyle seçtim, çünkü yalnızca "versio.txt" adlı tek bir dosyayı tutmak tüm siteyi yeniden yüklemeye zorlayacaktır.

QueryString yönteminin uygulanması zordur ve ayrıca önbelleğe alınır (v1.1'den önceki bir sürüme değiştirirseniz önbellekten yüklenirse, önbelleğin temizlenmediği ve önceki tüm sürümlerin önbellekte tutulduğu anlamına gelir).

Ben biraz acemiyim ve yöntemimin iyi bir yaklaşım olduğundan emin olmak için profesyonel kontrol ve değerlendirmenizi takdir ediyorum.

Umarım yardımcı olur.

Önbellek kontrolü: no-cache ayarlamaya ek olarak, yerel kopyanın her seferinde yenilenmesini istiyorsanız (IE'nin bazı sürümlerinde bunu gerektiriyor gibi görünüyor) Expires üstbilgisini -1 olarak ayarlamanız gerekir.

Bkz. HTTP Önbelleği - sunucuyla kontrol edin, her zaman If-Modified-Since gönderir

Kullanılabilecek bir hile vardır. Hile, komut dosyası etiketindeki dosya adına bir parametre / dize eklemek ve dosya değiştiğinde bunu değiştirmek.

<script src="myfile.js?version=1.0.0"></script>

Tarayıcı "?" Karakterinden sonra gelse de tüm dizeyi dosya yolu olarak yorumlar. parametrelerdir. Şimdi wat olur, bir dahaki sefere dosyanızı güncellediğinizde sadece web sitenizdeki kod etiketindeki sayıyı değiştirin (Örnek <script src="myfile.js?version=1.0.1"></script>) ve her kullanıcı tarayıcısı dosyanın değiştiğini görecek ve yeni bir kopyasını alacaktır.

Tarayıcıları önbelleği temizlemeye veya doğru verileri yeniden yüklemeye zorlamak ister misiniz? Stackoverflow, bazı işler açıklanan çözümlerin çoğunu denedim, ama kısa bir süre sonra, sonunda önbellek ve önceki yüklü komut dosyasını veya dosyayı görüntüler. Önbelleği (css, js, vb.) Temizleyecek ve aslında tüm tarayıcılarda çalışacak başka bir yol var mı?

Şimdiye kadar, sunucudaki dosyalarınızdaki tarih ve saati değiştirirseniz, belirli kaynakların ayrı ayrı yeniden yüklenebileceğini buldum. "Önbelleği temizlemek" olması gerektiği kadar kolay değil. Tarayıcılarımdaki önbelleği temizlemek yerine, önbelleğe alınan sunucu dosyalarına "dokunmanın" aslında sunucuda önbelleğe alınan kaynak dosyanın tarihini ve saatini değiştireceğini (Edge, Chrome ve Firefox'ta test edildi) fark ettim ve çoğu tarayıcı otomatik olarak en çok indirilecek Sunucunuzda neyin geçerli yeni kopyası (kod, grafikler herhangi bir multimedya). Programınız çalıştırılmadan önce sunucudaki en güncel komut dosyalarını kopyalamanızı ve "dokunma işlemini yap" çözümünü kullanmanızı öneririm , böylece tüm sorun dosyalarınızın tarihini en güncel tarih ve saate değiştirir, ardından yeni bir kopyasını indirir tarayıcınıza:

<?php
   touch('/www/sample/file1.css');
   touch('/www/sample/file2.js');
?>

sonra ... programınızın geri kalanı ...

Bu sorunu çözmem biraz zaman aldı (birçok tarayıcı farklı komutlara farklı davranıyor, ancak hepsi dosya saatlerini kontrol ediyor ve farklı tarih ve saat varsa yenileme işlemini yapacağınız tarayıcınızdaki indirilen kopyanızla karşılaştırıyor), sözde doğru yoldan gidemiyorum, her zaman başka bir kullanılabilir ve daha iyi bir çözüm var. Saygılarımızla ve mutlu kamp. Bu arada touch (); veya alternatifler javascript bash sh php dahil olmak üzere birçok programlama dilinde çalışır ve bunları html içine ekleyebilir veya arayabilirsiniz.

Önbelleği temizlemek mi yoksa yalnızca geçerli (değiştirilmiş?) Sayfanızın önbelleğe alınmadığından emin misiniz?

İkincisi ise, bu kadar basit olmalı

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">