Latest web development tutorials

HTML5 Application Cache

Verwenden Sie HTML5, durch einen Cache-Manifest-Datei erstellen, können Sie leicht Offline-Versionen von Web-Anwendungen erstellen können.

Was ist der Anwendungs-Cache (Application Cache)?

HTML5 bietet Anwendungs-Cache, was bedeutet, dass Web-Anwendungen zwischengespeichert werden können, und kann auch ohne Internetverbindung zugegriffen werden.

Application Cache Applikation bringt drei Vorteile:

  1. Offline-Browsing - Benutzer können sie in der Anwendung offline verwenden
  2. Speed ​​- im Cache-Ressourcen schneller geladen
  3. Reduzieren Sie die Serverlast - der Browser nur Download aktualisiert oder geändert Ressourcen vom Server.

Browser-Unterstützung

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 10, Firefox, Chrome, Safari und Opera unterstützen den Anwendungscache.

HTML5 Cache Manifest Beispiele

Das folgende Beispiel zeigt das HTML-Dokument mit einem Cache-Manifest (für Offline-Ansicht):

Beispiele

<!DOCTYPE HTML>
<html manifest="demo .appcache ">

<body>
文档内容......
</body>

</html>

Versuchen »

Cache-Manifest Basis

Um Anwendungs ​​Cache enthält das Etikett das Manifest Attribut im Dokument <html>:

<!DOCTYPE HTML>
<html manifest="demo .appcache ">
...
</html>

Das Manifest angegebene Seite, wenn Benutzer ihre zwischengespeichert werden zugreifen. Wenn das Manifest Attribut nicht angegeben ist, wird die Seite nicht im Cache gespeichert werden (es sei denn direkt die Seite in der Manifest-Datei angeben).

Empfohlene Manifest-Datei-Erweiterung: ". AppCache".

Bemerkung Bitte beachten Sie, Manifest-Dateien müssen den richtigen MIME-Typ, nämlich "text / Cache-Manifest" zu konfigurieren. Sie müssen auf dem Webserver konfiguriert werden.

Manifest-Datei

Manifest-Datei ist eine einfache Textdatei, die die Browser Inhalt des Cache erzählt (und Inhalt nicht zwischengespeichert).

manifest Dateien können in drei Teile unterteilt werden:

  • CACHE MANIFEST - in der Überschrift dieses Dokuments wird nach dem ersten Download zwischengespeichert werden
  • NETZ - In diesem Titel müssen die folgenden Dokumente auf dem Server zu verbinden, und werden nicht im Cache gespeichert werden
  • NOTFALL - In diese unter der Rubrik Dokumente Rollback - Seiten aufgelistet (zB Seite 404) , wenn die Seite ist nicht zugänglich

CACHE MANIFEST

Die erste Zeile, CACHE MANIFEST, ist erforderlich:

CACHE MANIFEST
/theme.css
/logo.gif
/main.js

Die obige Manifest-Datei listet drei Ressourcen: eine CSS-Datei, ein GIF-Bild und eine JavaScript-Datei. Wenn die Manifest-Datei geladen wird, wird der Browser die drei Dateien aus dem Stammverzeichnis Ihrer Website herunterladen. Dann, wenn der Benutzer vom Internet trennt, sind diese Mittel weiterhin zur Verfügung.

NETZWERK

Die folgenden Bestimmungen der Absätze NETWORK Datei "login.php" wird nie gecached und offline verfügbar ist nicht verfügbar:

NETWORK:
login.php

Sie können ein Sternchen verwenden, um alle anderen anderen Ressourcen / Dateien über eine Internetverbindung benötigen, um anzuzeigen:

NETWORK:
*

NOTFALL

NOTFALL Abschnitte unten definiert Wenn Sie eine Internetverbindung nicht herstellen können, mit "offline.html" Alternative / html5 / Verzeichnis aller Dateien:

FALLBACK:
/html/ /offline.html

Hinweis: Der erste URI ist die Ressource, die zweite ein Ersatz ist.

Cache aktualisieren

Sobald die Anwendung zwischengespeichert wird, wird es im Cache gespeichert bleiben, bis die folgenden Ereignisse eintritt:

  • Benutzer Browser-Cache zu löschen
  • Manifest-Datei geändert wird (siehe Tipps unten)
  • Durch das Programm, um die Anwendungs-Cache zu aktualisieren

Beispiel - Füllen Sie Manifest-Datei

CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js

NETWORK:
login.php

FALLBACK:
/html/ /offline.html

BemerkungTipp: Die "#" am Anfang der Kommentarzeile, sondern auch für andere Zwecke zu erfüllen.Caching-Anwendung wird aktualisiert, wenn sein Manifest-Datei ändert. Wenn Sie ein Bild bearbeiten oder eine JavaScript-Funktion zu ändern, werden diese Änderungen nicht erneut zwischengespeichert werden. Kommentarzeile ist ein Datum und die Versionsnummer des Browsers Datei Ansatz neu zu Cache.

Über Anwendungscache Anweisungen

Beachten Sie den Inhalt des Cache.

Sobald die Dateien zwischengespeichert werden, wird auch weiterhin der Browser die Cache-Version angezeigt werden, auch wenn Sie die Datei auf dem Server bearbeiten. Um sicherzustellen, dass Ihr Browser den Cache zu aktualisieren, müssen Sie die Manifest-Datei zu aktualisieren.

Hinweis: Der Browser Kapazitätsgrenze für Cache - Daten nicht die gleiche sein kann (einige Einschränkungen Browser - Einstellungen ist , dass jeder Standort 5MB).