Base de données Web SQL HTML5

Base de données HTML5 Web SQL

L'API Web SQL Database ne fait pas partie de la spécification HTML5, mais il s'agit d'une spécification indépendante qui introduit un ensemble d'API pour exploiter les bases de données client à l'aide de SQL.

Si vous êtes un programmeur web backend, il devrait être facile de comprendre les opérations SQL.

Vous pouvez également vous référer à notre tutoriel SQL pour en savoir plus sur les opérations de base de données.

La base de données Web SQL peut fonctionner dans les dernières versions des navigateurs Safari, Chrome et Opera.

Méthodes de base

Les Voici les trois méthodes principales définies dans la spécification :

openDatabase : Cette méthode crée un objet de base de données en utilisant une base de données existante ou une nouvelle base de données.

transaction : Cette méthode nous permet de contrôler une transaction et d'effectuer une validation ou une annulation en fonction de cette situation.

executeSql : Cette méthode est utilisée pour exécuter la requête SQL réelle.

Ouvrir la base de données

Si la base de données existe déjà, la méthode openDatabase se charge d'ouvrir la base de données. Si elle n'existe pas, ceci. la méthode le créera.

Utilisez le code suivant pour créer et ouvrir une base de données :

var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);

La méthode ci-dessus accepte les cinq paramètres suivants :

Nom de la base de données

Numéro de version

Texte de description

Taille de la base de données

Créer un rappel

Le dernier et cinquième paramètre, le rappel de création sera appelé après la création de la base de données. Cependant, même sans cette fonctionnalité, le runtime créera toujours la base de données et la version correcte.

Exécuter la requête

L'exécution de requêtes nécessite l'utilisation de la fonction database.transaction(). Cette fonction nécessite un paramètre, qui est une fonction responsable de l'exécution réelle de la requête, comme indiqué ci-dessous :

var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)'); });

L'instruction de requête ci-dessus créera une table appelée LOGS dans la base de données 'mydb'.

Opération d'insertion

Afin de créer une entrée dans la table, nous ajoutons une simple requête SQL à l'exemple ci-dessus comme suit :

var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)'); tx.executeSql('INSERT INTO LOGS (id, log) VALUES (1, "foobar")'); tx.executeSql('INSERT INTO LOGS (id, log) VALUES (2, "logmsg")'); });

Vous pouvez également la transmettre lorsque créer une entrée Valeurs dynamiques comme indiqué ci-dessous :

var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)'); tx.executeSql('INSERT INTO LOGS (id,log) VALUES (?, ?'), [e_id, e_log]; });

Ici, e_id et e_log sont des variables externes, executeSql mappera chaque entrée du paramètre du tableau à "?".

Opération de lecture

Pour lire un enregistrement déjà existant, nous pouvons utiliser un rappel pour capturer le résultat, comme ceci :

var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024); db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)'); tx.executeSql('INSERT INTO LOGS (id, log) VALUES (1, "foobar")'); tx.executeSql('INSERT INTO LOGS (id, log) VALUES (2, "logmsg")'); }); db.transaction(function (tx) { tx.executeSql('SELECT * FROM LOGS', [], function (tx, results) { var len = results.rows.length, i; msg = "
Found rows: " + len + "
"; document.querySelector('#status').innerHTML += msg; for (i = 0; i < len; i++){ alert(results.rows.item(i).log ); } }, null); });

Exemple final

      
  
状态信息
  

Supprimer les enregistrements

Le format utilisé pour supprimer les enregistrements est le suivant :

db.transaction(function (tx) { tx.executeSql('DELETE FROM LOGS WHERE id=1'); });

Supprimer l'identifiant de données spécifié peut également être dynamique :

db.transaction(function(tx) {
tx.executeSql('DELETE FROM LOGS WHERE id=?', [id]);
});

Mettre à jour l'enregistrement

Le format utilisé pour mettre à jour l'enregistrement est le suivant :

db.transaction(function (tx) { tx.executeSql('UPDATE LOGS SET log=\'www.w3cschool.cc\' WHERE id=2'); });

La mise à jour de l'identifiant de données spécifié peut également être dynamique :

db.transaction(function(tx) { tx.executeSql('UPDATE LOGS SET log=\'www.w3cschool.cc\' WHERE id=?', [id]);});