Push-Nachrichten von MacTechNews.de
Würden Sie gerne aktuelle Nachrichten aus der Apple-Welt direkt über Push-Nachrichten erhalten?
Forum>Entwickler>Suche "Offline Data Storage" Dokumentation

Suche "Offline Data Storage" Dokumentation

vetterjack
vetterjack02.09.0923:20
Hallo
Programmiere gerade eine Mobile Seite für das iPhone und habe nun in einem Buch etwas über "Offline Data storage" gelesen, dass man also eine SQL-Lite Datenbank mit JavaScript erstellen kann.
Bin nun auf der Suche nach einer Dokumentation über dieses Thema.
Google konnte mir bis jetzt noch nicht weiterhelfen.
0

Kommentare

MSN_Exploder
MSN_Exploder02.09.0923:46
Guggst du hier:

(http://dev.w3.org/html5/webstorage/)
(http://webreflection.blogspot.com/2009/08/w3-html5-storage-what-works-what-does.html)
(http://webkit.org/blog/126/webkit-does-html5-client-side-database-storage/)

Hilft dir hoffentlich aufs erste weiter...
„Es nützt der Freiheit nichts, dass wir sie abschaffen, um sie zu schützen.“
0
vetterjack
vetterjack04.09.0915:49
Vielen Dank!
0
dreyfus04.09.0916:00
Das hier auch noch: ...
0
vetterjack
vetterjack05.09.0919:08
OK, jetzt habe ich wieder genügen Stoff zum durchforsten. Vielen Dank
0
vetterjack
vetterjack11.09.0919:30
Gibt es hier auch jemanden in Forum, der sich damit auskennt?
Hab jetzt alles wie im Apple-Dokument beschrieben angewendet, aber es funktioniert nicht.
0
dreyfus11.09.0919:34

Die Frage ist jetzt aber wirklich ein wenig unspezifisch

Was sagt denn das Debugging in Safari? Gibt es Fehlermeldungen? Welche?
0
vetterjack
vetterjack11.09.0919:59
Hab das aktuelle Webkit Build aufm Mac, und die Konsole zeigt mir keinen Fehler an. Die Datenbank kann angelegt werden, aber Tabellen werden komischerweise nicht angelegt.
0
dreyfus11.09.0920:34

Kannst Du den Code posten?
0
vetterjack
vetterjack11.09.0920:59
Klar!
Hier ist der Abschnitt für die Erstellung der Datenbank. Das funktioniert auch noch einwandfrei, denn ich sehe sie im Webkit Build:
function initDB(){
try {
    if (!window.openDatabase) {
        alert('Leider werden Offline-Datenbanken von ihrem Client nicht unterstützt. Mehr Infos auf http://mactouch.eu !');
    } else {
        var shortName = 'weppstore';
        var version = '1.0';
        var displayName = 'Weppstore Database';
        var maxSize = 999999; // in bytes
        var mydb = openDatabase(shortName, version, displayName, maxSize);
 
        // You should have a database instance in mydb.
    }
} catch(e) {
    // Error handling code goes here.
    if (e == 2) {
        // Version number mismatch.
        alert("Ihre Datenbank-Version stimmt nicht. Bitte wenden Sie sich an den Support von Limet!");
    } else {
        alert("Fehler "+e+".");
    }
    return;
}
 
}

Und nun soll JS eigentlich eine Tabelle anlegen:
function nullDataHandler(transaction, results) { }
 
function createTables(db)
{
    db.transaction(
        function (transaction) {
 
            /* The first query causes the transaction to (intentionally) fail if the table exists. */
            transaction.executeSql('CREATE TABLE people(id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, name TEXT NOT NULL DEFAULT "John Doe", shirt TEXT NOT NULL DEFAULT "Purple");', [], nullDataHandler, errorHandler);
            /* These insertions will be skipped if the table already exists. */
            transaction.executeSql('insert into people (name, shirt) VALUES ("Joe", "Green");', [], nullDataHandler, errorHandler);
            transaction.executeSql('insert into people (name, shirt) VALUES ("Mark", "Blue");', [], nullDataHandler, errorHandler);
            transaction.executeSql('insert into people (name, shirt) VALUES ("Phil", "Orange");', [], nullDataHandler, errorHandler);
            transaction.executeSql('insert into people (name, shirt) VALUES ("jdoe", "Purple");', [], nullDataHandler, errorHandler);
        }
    );
}

0
dreyfus11.09.0921:23

Hm, wie rufst Du createTables(db) auf? Kann es sein, dass du die Variable mydb nur innerhalb der Funktion initDB deklariert hast? Dann würde ein Aufruf von createTables(mydb) nicht funktionieren... Versuch' mal

var mydb;

vor die Funktionen zu setzen und dann entsprechend nur noch

mydb = openDatabase(shortName, version, displayName, maxSize);

in der initDB() zu verwenden. Vielleicht war es das.
0
vetterjack
vetterjack11.09.0921:58
Das verstehe ich jetzt nicht ganz. Was du meinst schon, aber wie ich im Code ändern soll. Könntest du mir bitte den gefallen tun und den komplettgeänderten Code posten?
0
dreyfus11.09.0922:25

Das sollte bspw. gehen:

<html>
<head>
<title>test</title>

<script language="javascript">

var mydb;


function initDB(){
try {
if (!window.openDatabase) {
alert('Leider werden Offline-Datenbanken von ihrem Client nicht unterstützt. Mehr Infos auf http://mactouch.eu !');
} else {
var shortName = 'weppstore';
var version = '1.0';
var displayName = 'Weppstore Database';
var maxSize = 999999; // in bytes
mydb = openDatabase(shortName, version, displayName, maxSize);

// You should have a database instance in mydb.
}
} catch(e) {
// Error handling code goes here.
if (e == 2) {
// Version number mismatch.
alert("Ihre Datenbank-Version stimmt nicht. Bitte wenden Sie sich an den Support von Limet!");
} else {
alert("Fehler "+e+".");
}
return;
}

}

function nullDataHandler(transaction, results) { }

function errorHandler(transaction, error) {

    // Error is a human-readable string.

    alert('Oops.  Error was '+error.message+' (Code '+error.code+')');

}


function createTables(db)
{
db.transaction(
function (transaction) {

/* The first query causes the transaction to (intentionally) fail if the table exists. */
transaction.executeSql('CREATE TABLE people(id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, name TEXT NOT NULL DEFAULT "John Doe", shirt TEXT NOT NULL DEFAULT "Purple");', [], nullDataHandler, errorHandler);
/* These insertions will be skipped if the table already exists. */
transaction.executeSql('insert into people (name, shirt) VALUES ("Joe", "Green");', [], nullDataHandler, errorHandler);
transaction.executeSql('insert into people (name, shirt) VALUES ("Mark", "Blue");', [], nullDataHandler, errorHandler);
transaction.executeSql('insert into people (name, shirt) VALUES ("Phil", "Orange");', [], nullDataHandler, errorHandler);
transaction.executeSql('insert into people (name, shirt) VALUES ("jdoe", "Purple");', [], nullDataHandler, errorHandler);
}
);
}

</script>
</head>
<body onLoad="initDB(); createTables(mydb);">
...
</body>
</html>
0
vetterjack
vetterjack12.09.0909:28
Hey, vielen Dank. Jetzt sehe ich auch die Tabelle "people" in der Datenbank. Kann sein, dass ich mich nochmals an dich wenden muss, nun kommt der Teil mit dem Auslesen, und ob da alles funktionieren wird?
0
iThinkDifferent12.09.0911:23
Ich würde gerne mal wissen, wann dieses Feature in Firefox einzieht. Momentan gehts ja nur mit Google Gears, ich würde aber gern auf ein Plugin verzichten. Nur auf der Mozilla-Seite finde ich nichts.
0
vetterjack
vetterjack12.09.0914:05
iThinkDifferent
Ich würde gerne mal wissen, wann dieses Feature in Firefox einzieht. Momentan gehts ja nur mit Google Gears, ich würde aber gern auf ein Plugin verzichten. Nur auf der Mozilla-Seite finde ich nichts.

Mozilla muss HTML5 implementieren. Denn Offline Data Storage ist ein Feature von HTML5.
0
vetterjack
vetterjack12.09.0914:29
Nächste Fragen:

Wo kommt die Abfrage der Daten hin?
function dataHandler(transaction, results)
{
    // Handle the results
    var string = "Green shirt list contains the following people:\n\n";
    for (var i=0; i<results.rows.length; i++) {
        // Each row is a standard JavaScript array indexed by
        // column names.
        var row = results.rows.item(i);
        string = string + row['name'] + " (ID "+row['id']+")\n";
    }
    alert(string);
}
 
db.transaction(
    function (transaction) {
        transaction.executeSql("SELECT * from people where shirt='Green';",
            [], // array of values for the ? placeholders
            dataHandler, errorHandler);
    }
);

Und wie muss ich das Script umschreiben, um einfach z.B. eine Einstellung abzufragen? Etwa so:
document.getElementById('meindiv').style.visibility = ['hidden'];
Dieses hidden soll aus der Datenbank ausgelesen werden.

0
sierkb12.09.0914:52
vetterjack
Mozilla muss HTML5 implementieren.

Tut man dort. Man nimmt nur nicht zur selben Zeit wie das WebKit-Team dieselben Dinge in Angriff und konzentriert sich halt auf andere Dinge des bisherigen HTML5- bzw. XHTML5-Entwurfs bzw. nähert sich dem Ganzen aus einer anderen Richtung. Abgesehen davon ist HTML5/XHTML5 immer noch Draft, die Spezifikation ändert sich noch laufend. Also ist man seitens der Browser-Hersteller auch entsprechend vorsichtig, weil man sonst ständig irgendwo was ändern und nachbessern müsste, um mit der noch unfertigen und in Arbeit befindlichen Spezifikation konform zu bleiben.

Mozilla Developer: Offline resources in Firefox

Im kommenden Firefox 3.6 wird das Thema "Offline resources and data storage" dann noch weiter ausgebaut:

dreyfus:

<script language="javascript">

Wann stirbt so ein sinnfreier Schwachfug eigentlich endlich mal mal aus?
Richtig wäre
<script type="text/javascript">
, noch richtiger gemäß RFC4329 wohl
<script type="application/javascript">
oder
<script type="application/ecmascript">
im Falle von ECMAScript...
0
iThinkDifferent12.09.0915:43
skierb
Im kommenden Firefox 3.6 wird das Thema "Offline resources and data storage" dann noch weiter ausgebaut:
Aber leider nur für Addons und XUL.
0
dreyfus12.09.0917:37
vetterjack:

Beispiel:
<html>
<head>
<title>test</title>

<script type="text/javascript">

var mydb;


function initDB(){
try {
if (!window.openDatabase) {
alert('Leider werden Offline-Datenbanken von ihrem Client nicht unterstützt. Mehr Infos auf http://mactouch.eu !');
} else {
var shortName = 'weppstore';
var version = '1.0';
var displayName = 'Weppstore Database';
var maxSize = 999999; // in bytes
mydb = openDatabase(shortName, version, displayName, maxSize);

// You should have a database instance in mydb.
}
} catch(e) {
// Error handling code goes here.
if (e == 2) {
// Version number mismatch.
alert("Ihre Datenbank-Version stimmt nicht. Bitte wenden Sie sich an den Support von Limet!");
} else {
alert("Fehler "+e+".");
}
return;
}

}

function nullDataHandler(transaction, results) { }

function errorHandler(transaction, error) { }


function createTables(db)
{
db.transaction(
function (transaction) {

/* The first query causes the transaction to (intentionally) fail if the table exists. */
transaction.executeSql('CREATE TABLE people(id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, name TEXT NOT NULL DEFAULT "John Doe", shirt TEXT NOT NULL DEFAULT "Purple");', [], nullDataHandler, errorHandler);
/* These insertions will be skipped if the table already exists. */
transaction.executeSql('insert into people (name, shirt) VALUES ("Joe", "Green");', [], nullDataHandler, errorHandler);
transaction.executeSql('insert into people (name, shirt) VALUES ("Jim", "Green");', [], nullDataHandler, errorHandler);
transaction.executeSql('insert into people (name, shirt) VALUES ("Mark", "Blue");', [], nullDataHandler, errorHandler);
transaction.executeSql('insert into people (name, shirt) VALUES ("Phil", "Orange");', [], nullDataHandler, errorHandler);
transaction.executeSql('insert into people (name, shirt) VALUES ("jdoe", "Purple");', [], nullDataHandler, errorHandler);
}
);
}

function dataHandler(transaction, results)
{
// Handle the results
var string = "<h3>Green Shirt List:</h3>";
string = string + '<table cellspacing="4"><tr><th>Name</th><th>ID</th></tr>';
for (var i=0; i<results.rows.length; i++) {
// Each row is a standard JavaScript array indexed by
// column names.
var row = results.rows.item(i);
string = string + "<tr><td>" + row['name'] + "</td><td>" + row['id'] +"</td></tr>";
}
string = string + "</table>";
document.getElementById('queryResult').innerHTML = string;
}

function dieGruenen(db)
{

db.transaction(
function (transaction) {
transaction.executeSql("SELECT * from people where shirt='Green';",
[], // array of values for the ? placeholders
dataHandler, errorHandler);
}
);
}


</script>
</head>
<body onLoad="initDB(); createTables(mydb); dieGruenen(mydb);">
<span id="queryResult"></span>
</body>
</html>

Genauso, wie ich hier

document.getElementById('queryResult').innerHTML = string;

nutze, kannst Du auch

document.getElementById('meindiv').style.visibility = row['name'];

verwenden, wobei natürlich "row" auf die aktuelle Ergebnisreihe verweist (wie im Beispiel) und 'name' der Bezeichner einer existierenden Tabellenspalte sein muss.
0
vetterjack
vetterjack12.09.0922:07
Wenn ich meine Variante Anwenden will, muss ich dann auch diesen Code davor setzen:
var string = "<h3>Green Shirt List:</h3>";
string = string + '<table cellspacing="4"><tr><th>Name</th><th>ID</th></tr>';
for (var i=0; i<results.rows.length; i++) {
// Each row is a standard JavaScript array indexed by
// column names.
var row = results.rows.item(i);
string = string + "<tr><td>" + row['name'] + "</td><td>" + row['id'] +"</td></tr>";
}
string = string + "</table>";

??

Aber schonmal vielen Dank!
0
dreyfus13.09.0900:12
Naja, wenn Du keine Tabelle ausgeben willst, musst Du auch den Code dafür nicht schreiben. Essentiell sind eigentlich nur die "for" Schleife - diese durchläuft alle Datensätze, die von der Abfrage zurückgegeben wurden und die Zuweisung "var row = results.rows.item(i);", diese enthält den aktuellen Datensatz. Was Du dann mit den über row['Feldname'] ausgelesenen Daten machst ist dir überlassen
0

Kommentieren

Diese Diskussion ist bereits mehr als 3 Monate alt und kann daher nicht mehr kommentiert werden.

Mac mini M4
Mac mini M4
iPad Pro M4 wird grün – Displayfehler bei immer mehr Nutzern
iPad Pro M4 wird grün – Displayfehler bei immer...
PIN-Code erraten: Dauer
PIN-Code erraten: Dauer
Apple kündigt Systemupdates für heute Abend an – und bestätigt Termin für Apple Intelligence in der EU
Apple kündigt Systemupdates für heute Abend an ...
iPad Pro M4: Hinweise auf geringere Nachfrage
iPad Pro M4: Hinweise auf geringere Nachfrage
Apple gewährt Einblick in Audio- und Video-Testlabor für iPhones
Apple gewährt Einblick in Audio- und Video-Test...
Kurz: Apple bietet iPhone 15 erstmals refurbished an +++ Dells konfuse neue Produktnamen sorgen für Spott
Kurz: Apple bietet iPhone 15 erstmals refurbish...
Das MacBook Pro M4
Das MacBook Pro M4