Öffnen Sie eine Webseite. Wenn die Internetverbindung nach dem Laden plötzlich unterbrochen wird, ist die Seite nach dem Aktualisieren verschwunden.
Haben Sie jemals daran gedacht, dass die Seite nach dem Aktualisieren immer noch dieselbe ist wie zuvor? Wenn Sie eine andere Seite in einem neuen Fenster öffnen und dieselbe URL eingeben, ist es immer noch dieselbe Seite, wenn Sie nicht mit dem Internet verbunden sind. . HTML5-Offline-Anwendungen bieten eine solche Funktion.
Wenn die Daten auf der Seite geladen sind, können Sie einige Bilder, Flash, CSS, JS, HTML und andere Dateien zwischenspeichern. Sie können diese zwischengespeicherten Dateien das nächste Mal verwenden, wenn das Internet nicht verfügbar ist. Dies ist die Offline-Anwendung von HTML5.
Tatsächlich ist es sehr einfach umzusetzen.
Erfordert einen Server. Hier verwenden wir zur Erklärung den Tomcat-Server.
Konfigurieren Sie zunächst den Minentyp der Datei mit dem Suffix .manifest für text/cache-manifest.
Wenn es um die Tomcat-Konfiguration geht, werden bekannte Freunde natürlich an die Datei web.xml denken. Ja, fügen Sie einfach die folgende Konfiguration zur Datei hinzu:
manifest ;mime-type> ;text/cache-manifest
Dann schreiben Sie eine xxx.manifest-Datei, xxx ist ein Name, den Sie selbst wählen . Das Format dieser Datei ist wie folgt:
CACHE MANIFEST
#version 1.5
CACHE:
MyTest.html
CSS/main.css
Javascript/bwH5LS.js
exp-calif-logo.gif
Die erste Zeile ist erforderlich, sie gibt an, dass es sich um die Manifest-Konfigurationsdatei handelt.
#Version 1.5
Dieser Satz ist ein Kommentar und hat keine tatsächliche Auswirkung. Ich möchte nur, dass der Browser die Cache-Datei aktualisiert. Denn wenn die Manifestdatei mit dem Original übereinstimmt, lädt der Browser die Cache-Datei nicht neu. Daher können wir diesen Kommentar verwenden, um einerseits die Versionsnummer zu ändern und andererseits den Browser den Cache aktualisieren zu lassen.
CACHE:
Diese Zeile gibt an, dass die folgende Datei zwischengespeichert werden soll. Im Beispiel werden die aktuelle Seite: MyTest.html sowie einige CSS- und JS-Dateien und Bilder zwischengespeichert.
Es gibt einige Schlüsselwortbeispiele, die nicht erwähnt werden, nämlich
NETWORK:
FALLBACK:
NETWORK bezieht sich auf Seiten, die nicht zwischengespeichert werden möchten; FALLBACK bezieht sich darauf, dass die angeforderte Datei nicht gefunden wird oder der Server nicht gefunden wird Wenn die Datei nicht verfügbar ist, gibt es als Antwort Alternativen: Wenn wir beispielsweise eine verschachtelte Seite anfordern möchten, der Server dieser Seite jedoch nicht verbunden werden kann, kann ich zu einer anderen angegebenen Seite wechseln.
Dies ist der zweite und dritte Schritt. Fügen Sie einfach den Speicherort des Manifests im -Tag hinzu:
einfache Offline-Anwendungen implementieren.
Wo sind diese zwischengespeicherten Dateien?
Ich habe es auf Chrome getestet und festgestellt, dass es diese Dateien nach seinem eigenen Mechanismus in Blöcken speichert, sodass ich nicht die vollständige Datei finden konnte. Die gespeicherten Daten befinden sich in: C:UsersjasonlingAppDataLocalGoogleChromeUser DataDefault. Ich weiß nicht, wie ich sie konkret speichern soll.
Dateien werden auch in Firefox nach einem eigenen Mechanismus gespeichert. Nach dem Öffnen mit SQLite fand der Autor jedoch die spezifischen Informationen der zwischengespeicherten Datei:
Interessierte Leser können es selbst ausprobieren und sehen, ob es funktioniert . Neue Entdeckungen.