Browser zum Löschen des Cache zwingen

Question

Gibt es eine Möglichkeit, einen Code auf meiner Seite zu platzieren, so dass beim Besuch einer Website der Browser-Cache gelöscht wird, damit die Änderungen angezeigt werden können?

Verwendete Sprachen: ASP.NET, VB.NET, und natürlich HTML, CSS und jQuery.

Answer 1

Wenn es sich um .css y .js Änderungen, ist eine Möglichkeit, "cache busting" ist durch das Anhängen etwas wie " _versionNo " an den Dateinamen für jede Version an. Zum Beispiel:

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.

Alternativ können Sie dies auch nach dem Dateinamen tun:

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.

Hier können Sie sich informieren enlace um zu sehen, wie es funktionieren könnte.

Answer 2

Sehen Sie sich die cache-control und die Läuft ab META-Tag.

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

Eine weitere gängige Praxis besteht darin, ständig wechselnde Zeichenfolgen an das Ende der angeforderten Dateien anzuhängen. Zum Beispiel:

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

Answer 3

Aktualisierung 2012

Dies ist eine alte Frage, aber ich denke, sie braucht eine aktuellere Antwort, weil es jetzt eine Möglichkeit gibt, mehr Kontrolle über das Website-Caching zu haben.

Unter Offline-Webanwendungen (was eigentlich jede HTML5-Website ist) applicationCache.swapCache() kann verwendet werden, um die zwischengespeicherte Version Ihrer Website zu aktualisieren, ohne dass die Seite manuell neu geladen werden muss.

Dies ist ein Codebeispiel aus dem Leitfaden für Anfänger zur Verwendung des Anwendungs-Cache zu HTML5 Rocks, in dem erklärt wird, wie Sie die Nutzer auf die neueste Version Ihrer Website aktualisieren können:

// 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);

Siehe auch Verwendung des Anwendungscaches auf Mozilla Developer Network für weitere Informationen.

Update 2016

Im Web ändern sich die Dinge schnell. Diese Frage wurde 2009 gestellt und 2012 habe ich ein Update über eine neue Methode zur Lösung des in der Frage beschriebenen Problems veröffentlicht. Es vergingen weitere 4 Jahre und jetzt scheint es, dass es bereits veraltet ist. Dank an cgaldiolo dass Sie in den Kommentaren darauf hingewiesen haben.

Derzeit, d. h. ab Juli 2016, ist die HTML Standard, Abschnitt 7.9, Offline-Webanwendungen enthält eine Warnung vor der Veraltung:

Diese Funktion wird zur Zeit entfernt (Dies ist ein langwieriger Prozess, der viele Jahre dauert.) Die Verwendung einer der Offline-Webanwendungsfunktionen wird derzeit dringend abgeraten. Verwenden Sie stattdessen Service Worker.

Das gilt auch für Verwendung des Anwendungscaches im Mozilla Developer Network, auf das ich 2012 verwiesen habe:

Abgelehnt
Diese Funktion wurde aus den Webstandards entfernt. Auch wenn einige Browser sie noch unterstützen, wird sie derzeit fallen gelassen. Verwenden Sie es weder in alten noch in neuen Projekten. Seiten oder Webanwendungen die diese Funktion verwenden, können jederzeit ausfallen.

Siehe auch Bug 1204581 - Hinzufügen eines Verwerfungshinweises für AppCache, wenn das Abfangen von Service Workern aktiviert ist .

Answer 4

Nicht als solche. Eine Methode besteht darin, bei der Übermittlung von Inhalten die entsprechenden Kopfzeilen zu senden, um den Browser zum Neuladen zu zwingen:

Sicherstellen, dass eine Webseite nicht in allen Browsern zwischengespeichert wird.

Wenn Ihre Suche nach "cache header" oder etwas Ähnliches hier auf SO, finden Sie ASP.NET-spezifische Beispiele.

Eine andere, weniger saubere, aber manchmal einzige Möglichkeit, wenn Sie die Header auf der Serverseite nicht kontrollieren können, ist das Hinzufügen eines zufälligen GET-Parameters zu der aufgerufenen Ressource:

myimage.gif?random=1923849839

Answer 5

Ich hatte ein ähnliches Problem und habe es folgendermaßen gelöst:

1. Unter index.html Datei habe ich das Manifest hinzugefügt:

   <html manifest="cache.manifest">

2. Unter <head> Abschnitt Skript zur Aktualisierung des Cache enthalten:

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

3. Unter <body> Abschnitt habe ich die Funktion onload eingefügt:

   <body onload="checkForUpdate()">

4. Unter cache.manifest Ich habe alle Dateien, die ich zwischenspeichern möchte, gespeichert. Es ist jetzt wichtig, dass es in meinem Fall (Apache) funktioniert nur durch die Aktualisierung jedes Mal die "Version" Kommentar. Es gibt auch die Möglichkeit, Dateien mit "?ver=001" oder so am Ende des Namens zu benennen, aber das ist nicht erforderlich . Ändern Sie einfach # version 1.01 löst das Ereignis "Cache-Aktualisierung" aus.

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

   Es ist wichtig, die Punkte 1., 2. und 3. zu berücksichtigen. nur in index.html. Ansonsten

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

   tritt auf, weil jede "untergeordnete" Datei versucht, die Seite zwischenzuspeichern, während die Seite bereits zwischengespeichert ist.

5. Unter update_cache.js Datei habe ich diesen Code eingefügt:

   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();
   }

Jetzt müssen Sie nur noch Dateien ändern und im Manifest den Versionskommentar aktualisieren. Wenn Sie nun die Seite index.html aufrufen, wird der Cache aktualisiert.

Die Teile der Lösung sind nicht von mir, sondern ich habe sie im Internet gefunden und so zusammengesetzt, dass es funktioniert.