Introduzione a Web SQL Database in Javascript
Web SQL Database è un API web per lo storage dei dati in formato database nel browser attraverso Javascript.
In sostanza si tratta di una delle varie API per lo storage dei dati nelle web application.
Al momento Firefox non è compatibile con questa API, in quanto ne sfrutta un'altra che vedremo prossimamente.
Ma può essere comunque utile conoscerla, in quanto è compatibile con Android e Safari (e quindi iOS).
Il suo utilizzo è molto semplice, in quanto condivide la stessa sintassi dei database che probabilmente già conoscete.
Qua sotto un esempio completo:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test Web SQL</title>
<script>
// CREIAMO UN DATABASE PASSANDO QUESTI PARAMETRI:
// nome database
// versione
// descrizione
// dimensione
var db = openDatabase('test_db', '1.0', 'Test Web SQL', 2 * 1024 * 1024);
// INIZIAMO TRANSAZIONE PER EFFETTUARE OPERAZIONI
db.transaction(function (tx) {
// CREIAMO UNA TABELLA SE NON ESISTE
tx.executeSql('CREATE TABLE IF NOT EXISTS test (id unique, text)');
// INSERIAMO DUE RECORDS
tx.executeSql('INSERT INTO test (id, text) VALUES (1, "matteo")');
tx.executeSql('INSERT INTO test (id, text) VALUES (2, "sveva")');
});
db.transaction(function (tx) {
// INIZIAMO TRANSAZIONE PER ESTRARRE I DATI
tx.executeSql('SELECT * FROM test', [], function (tx, results) {
var len = results.rows.length, i;
document.querySelector('#count').innerHTML = len;
for (i = 0; i < len; i++) {
document.querySelector('#records').innerHTML += '<p>' +
results.rows.item(i).text + '</p>';
}
}, null);
});
</script>
</head>
<body>
<div id="count"></div>
<div id="records"></div>
</body>
</html>Vi ho commentato il codice, già di per se molto semplice.
Ovviamente sono supportate anche altre istruzioni SQL, come ad esempio:
tx.executeSql('DROP TABLE test');
Questa cancella la tabella.
Fate un pò di prove, e un pò di debug in console.
Enjoy!
javascript web sql database sql database opendatabase
1 Commenti
Salve, vorrei sapere se webSql supporta il formato dati per memorizzare i JSON, grazie.
16/08/2020