Ausführliche Erläuterung, wie man zwischen HTML5-Offlinespeicher und lokalen Cache-Instanzen unterscheidet

1. Offline-Speicherung

Es gibt eine Webanwendung mit drei Dateien: index.html, a.js, b.css. Jetzt müssen die js- und css-Dateien zwischengespeichert werden

1. Fügen Sie

zu index.html hinzu. 2. Das Manifestformat ist wie folgt:

CACHE MANIFEST
#上面一句必须
#v1.0.0
#需要缓存的文件
CACHE:
a.js
b.css
#不需要缓存的文件
NETWORK:
*
#无法访问页面
FALLBACK:
404.html

3. Das Mime des Manifestdateityps muss vom Typ text/cache-manifest sein

Hinweis:

1. Für jedes index.html?id=1 oder index.html?id=2, Der Index wird separat zwischengespeichert. Sie können ihn über den Ressourcen-/Anwendungscache des Chrome-Browsers beobachten.

2. Wenn Sie den Cache-Inhalt aktualisieren möchten, ändern Sie einfach die Manifestdatei, z. B. die Version Nummer v1.0.1

4. Wenn die Ressourcen im Offline-Speicher aktualisiert werden, können Sie sie mit dem folgenden Code überwachen, aber beim ersten Laden handelt es sich immer noch um die Originalversion

window.applicationCache.addEventListener('updateready',function(e){    
  if(window.applicationCache.status == window.applicationCache.UPDATEREADY){
    window.applicationCache.swapCache();        
    if(confirm("loding new?")){
      window.location.reload()
    }
 }
},false)

2. Lokaler Cache

localStorage.setItem("key","value")
localStorage.getItem("key","value")
localStorage.removeItem("key")
localStorage.clear()

1. Der lokale Speicher läuft nie ab, es sei denn, Sie löschen ihn selbst

2. Sie können ihn über den Chrome-Browser „Ressourcen/Lokaler Speicher“ anzeigen

3. Auch wenn der Schlüssel in verschiedenen Domänen gleich ist, wird er nicht abgerufen. Die erhaltenen Werte sind ebenfalls unterschiedlich, z. B. localhost und 127.0.0.1

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung, wie man zwischen HTML5-Offlinespeicher und lokalen Cache-Instanzen unterscheidet. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!