Cookie-Alternative

Neue Schnittstelle: IndexedDB

Autor: Andreas Hitzig • 6.9.2011 • ca. 3:30 Min

Inhalt

Neue Schnittstelle: IndexedDB ...

Neue Schnittstelle: IndexedDB

Die Datenbank-unterstützte Speicherung geht in Richtung Indexed Database API.

Der neue Vorschlag für die Implementierung einer Schnittstelle zur Anbindung einer Datenbank über den Browser ist unter dem Namen Indexed Database API oder auch Indexed DB bekannt gegeben worden. Das Diskussionspapier für diese Schnittstelle ist zuerst unter dem Namen WebSimpleDB bekannt geworden und liegt als aktuelle Draft-Version bei der W3C zur weiteren Bearbeitung (www.w3.org/TR/IndexedDB/ ). Für diesen Standard gibt es bereits zahlreiche Unterstützung: Oracle hat den Vorschlag eingebracht und in Mozilla, Microsoft und Google drei mächtige Mitstreiter gefunden.

Der Vorschlag

Die Schnittstelle soll in zwei Varianten implementiert werden: asynchron und synchron. Das folgende Beispiel zeigt klar die Unterschiede zwischen den beiden Herangehensweisen für den Datenaustausch über die Schnittstelle. In beiden Fällen wird auf eine zentrale Datenbank books zugegriffen, in der alle Bücher samt ISBN-Nummer und Autor abgelegt sind. Gesucht wird nach einem Buch vom Autor andreas.

var db = indexedDB.open("books",
"Book store", false);
if (db.version !== "1.0") {
var olddb = indexedDB.open("books",
"Book store");
olddb.createObjectStore("books",
"isbn");
olddb.createIndex("BookAuthor",
"books", "author", false);
olddb.setVersion("1.0");
}
// db.version === "1.0";
var index = db.openIndex
("BookAuthor");
var matching = index.get("andreas");
if (matching)
report(matching.isbn, matching.name,
matching.author);
else
report(null)

Im ersten Schritt öffnen Sie die Datenbank books und geben gleichzeitig die Beschreibung der Datenbank mit. Dann wird überprüft, ob die Datenbank bereits vorhanden ist. Dazu bedient sich das Skript der Versionsinformation der Datenbank: Hat diese den Wert 1, hat der Besucher bereits einmal die Datenbank benutzt und es sind Werte vorhanden.Ist die Datenbank nicht vorhanden, wird diese angelegt und anschließend der richtige Index und die richtige Version zugewiesen. Dies geschieht innerhalb der if-Abfrage. Im zweiten Schritt findet die eigentliche Abfrage statt: Sie greifen als Erstes auf den Index zu BookAuthor zu und ermitteln anschließend Einträge mit dem Wert andreas. Bei Treffern geben Sie zum Eintrag die ISBN-Nummer, den Namen des Buches sowie den Autor aus.

Asynchrone Herangehensweise

Beim asychronen Ansatz ist vor allem der Zugriff auf die Datenbank mit der richtigen Version das schwierige Unterfangen. Nur so kann sichergestellt werden, dass Sie Zugriff auf die aktuellen Daten haben und an keiner anderen Stelle Änderungen durchgeführt werden. Die eigentliche Suche nach dem richtigen Autor, die in der Funktion findMe() gekapselt ist, ähnelt sehr stark der synchronen Variante und ist lediglich um einige Besonderheiten, welche der asynchronen Herangehensweise geschuldet sind, ergänzt.

function findMe() {
var store = db.objectStore("books");
var index = store.index
("BookAuthor");
var req = index.get("andreas");
req.onsuccess = function(event) {
var matching = event.result;
report(matching.isbn, matching.name,
matching.author);
}
req.onerror = function(event) {
report(null);
}
}

Die wesentliche Arbeit besteht im Anlegen oder Zugriff auf die Datenbank. In der ers-ten if-Abfrage wird überprüft, ob es sich um den ersten Besuch handelt und in diesem Fall als Erstes die Datenbank initialisiert. Tritt dabei ein Problem auf, weil parallel eine andere Session das Gleiche versucht, wird eine Fehlermeldung ausgegeben.Waren Sie erfolgreich, wird die Datenbank sowie der Index angelegt. Auch bei diesen Aktionen wird wieder großen Wert auf die Behandlung von Fehlern gelegt und eine entsprechende Routine mit implementiert. Haben Sie auch diese Hürde passiert, rufen Sie die Funktion findMe() und damit die Abfrage der Datenbank auf.Findet die Routine eine Datenbank mit der Versionsnummer 1.0, wird direkt die Funktion findMe() aufgerufen.

var db;
var dbRequest = indexedDB.open
("books", "Book store");
dbRequest.onsuccess = function
(event) {
db = event.result;
if (db.version != "1.0") {
var versionRequest = db.setVersion
("1.0");
versionRequest.ontimeout = function
(event) {
throw new Error("Timeout beim Versuch
die Version auf 1.0 zu setzen");
}
versionRequest.onsuccess = function
(event) {
var store = db.createObjectStore
("books2, "isbn");
store.createIndex("BookAuthor",
"books", "author", false);
event.transaction.onabort = function
(event) {
throw new Error("Fehler beim Setzen
der Version auf 1.0");
}
event.transaction.oncomplete =
function(event) {
findMe(db);
}
}
} else {
findMe(db);
}
}

Kompatibel dank Varianten

Bereits im Juni 2009 gab es erste Diskussionen im Mozilla-Forum zur lokalen Speicherung von Daten.

Die erweiterte lokale Speicherung von Daten auf Basis von sessionStorage und localStorage bietet eine interessante und hilfreiche Erweiterung der existierenden Cookie-Funktionalität. Da jedoch immer noch viele Anwender mit älteren Browsern, wie dem IE 7 unterwegs sind, müssen Sie noch auf längere Zeit zwei Varianten nutzen, um die benötigte Kompatibilität zu gewährleisten.Bei der Implementierung der Datenbank-Funktionalität zeichnet sich mit IndexedDB eine Lösung ab, die von den großen Browser-Herstellern entsprechend unterstützt wird. Wird diese vollständig implementiert, bietet Sie eine Alternative zur Speicherung größerer Datenmengen. Da dieser Teil noch nicht vollständig verabschiedet ist, gibt es bis jetzt auch noch keine finale Gewissheit, ob und wie die einzelnen Hersteller die definierte Lösung umsetzen.