HTML5 bringt den Entwicklern eine ganze Menge neue Möglichkeiten. Eine der interessantesten Spezifikationen ist die “Offline Web Applications API” die den Entwicklern die Möglichkeit gibt Applikationen zu erstellen die vollständig oder teilweise offline genutzt werden können.
Komponenten
Voraussetzungen in der HTML-Datei
Die Offline Web Applications API wird mit dem HTML5-Standards implementiert, ist also nur in modernen Browsern verfügbar, die HTML5 bereits unterstützen. Dazu ist es notwendig, dass dem Browser über den Doctype zu verstehen gegeben wird, dass es sich um eine HTML5 Webseite handelt. Dazu muss der Doctype folgendermaßen aussehen:
<DOCTYPE HTML>
Ist diese Voraussetzung gegeben, muss dem Browser mitgeteilt werden, dass diese Webseite zu cachende Elemente enthält. Dazu wurde im Zuge von HTML5, das <html> Element mit dem Attribut “manifest” erweitert. Das Attribut enthält als Wert einen frei definierten Dateinamen oder Pfad zu einer Datei, die Informationen zum Cache enthält – Die so genannte manifest-Datei.
Eine vollständig vorbereitete HTML-Seite könnte folgendermaßen aussehen:
<html manifest="offline.manifest">
<head>
<title>Offline-Page</title>
</head>
<body>
<h1>Headline</h1>
<img src="image.png" />
<p>Lorem ipsum dolor sit amet ...</p>
</body>
</html>
Die Manifest-Datei
Die Wikipedia definiert ein Manifest folgendermaßen:
Manifest, eine öffentliche Erklärung von Zielen und Absichten, oftmals politischer Natur
Die Manifest-Datei beschreibt in unserem Falle genau, welche Dateien im Cache gespeichert werden sollen, und welche nicht. Dabei ist die Datei nach einem bestimmten Schema aufgebaut, und in verschiedene Sektionen unterteilt.
Eingeleitet wird die Datei mit der Zeile:
CACHE MANIFEST
Darunter werden die verschiedenen Sektionen definiert. Jede Sektion hat dabei ihre eigene Augabe. Der NETWORK-Bereich definiert die Dateien, die nicht im Cache gespeichert werden sollen. Im Gegensatz dazu definiert der CACHE-Bereich, die Dateien, die im Cache gehalten werden sollen. Die definierten Dateien können dabei absolute Pfade und URLs beinhalten. Ein Beispiel:
CACHE MANIFEST
NETWORK:
login.php
CACHE:
image.png
Zu beachten ist weiterhin, dass die Manifest-Datei mit dem Content-Type “text/cache-manifest” ausgeliefert werden muss. Das kann entweder im Webserver anhand des Dateityps, oder im Skript selbst definiert werden.
Ergebnis
Ruft man die HTML-Seite nun ein mal auf, wird diese lokal im Brower abgelegt. Geht man nun offline und ruft die gleiche URL noch einmal auf, wird die Seite wie gewohnt angezeigt, da die Daten aus dem Cache genutzt werden. Damit ist es möglich, Applikationen zu entwickeln, die JavaScript-gestützt vollständig offline funktionieren.