SQLite Wasm reposant sur le système de fichiers privé d'origine, il remplace la technologie de base de données Web SQL obsolète, de manière polyvalente. Cet article explique comment migrer vos données de Web SQL vers SQLite Wasm.
Arrière-plan requis
L'article Abandonner et supprimer Web SQL annonçait l'abandon de la technologie de base de données Web SQL. Bien que la technologie en elle-même puisse être obsolète, les cas d'utilisation dont elle est faite ne le sont pas beaucoup. C'est pourquoi l'article de suivi Wasm Wasm dans le navigateur reposant sur le système de fichiers privé d'origine décrit un ensemble de technologies de remplacement basées sur la base de données SQLite, compilée sur Web Assembly (Wasm) et reposant sur le système de fichiers privés d'origine. Pour fermer le cercle, cet article explique comment migrer des bases de données de Web SQL vers SQLite Wasm.
Migrer vos bases de données
Les quatre étapes suivantes illustrent le concept de migration d'une base de données Web SQL vers SQLite Wasm, avec la base de données SQLite reposant sur le système de fichiers privé d'origine. Vous pourrez ainsi créer un code personnalisé en fonction de vos besoins de migration Web SQL.
Bases de données Web SQL à migrer
Dans ce guide de migration, nous partons du principe que vous disposez d'une (ou plusieurs) bases de données Web SQL existantes contenant des données pertinentes pour votre application. Dans la capture d'écran ci-dessous, vous voyez un exemple de base de données appelée mydatabase, avec une table de tempêtes de pluie qui met en correspondance les humeurs et les niveaux de gravité. Les outils pour les développeurs Chrome vous permettent d'afficher les bases de données Web SQL à des fins de débogage, comme illustré dans la capture d'écran suivante.
Traduire la base de données Web SQL en instructions SQL
Pour migrer les données de manière transparente pour l'utilisateur, c'est-à-dire sans que celui-ci n'ait à effectuer la migration par lui-même, les données de la base de données doivent être traduites en instructions SQL d'origine qui les ont créées. Ce défi a déjà été abordé, et le script de migration utilisé dans cet article (mywebsqldump.js) est basé sur une bibliothèque de la communauté appelée websqldump.js, avec quelques ajustements mineurs. L'exemple de code suivant montre le code requis pour traduire la base de données Web SQL mydatabase en un ensemble d'instructions SQL.
websqldump.export({
database: 'mydatabase',
version: '1.0',
success: function(sql) {
// The SQL statements.
},
error: function(err) {
// Handle the error.
}
});
L'exécution de ce code génère la chaîne d'instructions SQL ci-dessous.
CREATE TABLE IF NOT EXISTS rainstorms (mood text, severity int);
INSERT INTO rainstorms(mood,severity) VALUES ('somber','6');
INSERT INTO rainstorms(mood,severity) VALUES ('rainy','8');
INSERT INTO rainstorms(mood,severity) VALUES ('stormy','2');
Importer les données dans SQLite Wasm
Il ne reste plus qu'à exécuter ces commandes SQL dans le contexte de SQLite Wasm. Pour en savoir plus sur la configuration de SQLite Wasm, je vous invite à consulter l'article SQLite Wasm dans le navigateur reposant sur le système de fichiers privé d'origine, mais vous trouverez à nouveau l'essentiel ci-dessous. N'oubliez pas que ce code doit s'exécuter dans un worker (que la bibliothèque crée automatiquement pour vous), avec les en-têtes HTTP requis correctement définis. Vous pouvez installer le package @sqlite.org/sqlite-wasm à partir de npm.
import { sqlite3Worker1Promiser } from '@sqlite.org/sqlite-wasm';
(async () => {
try {
const promiser = await new Promise((resolve) => {
const _promiser = sqlite3Worker1Promiser({
onready: () => {
resolve(_promiser);
},
});
});
let response;
response = await promiser('open', {
filename: 'file:mydatabase.db?vfs=opfs',
});
const { dbId } = response;
const sql = `
CREATE TABLE IF NOT EXISTS rainstorms (mood text, severity int);
INSERT INTO rainstorms(mood,severity) VALUES ('somber','6');
INSERT INTO rainstorms(mood,severity) VALUES ('rainy','8');
INSERT INTO rainstorms(mood,severity) VALUES ('stormy','2');`
await promiser('exec', { dbId, sql });
await promiser('close', { dbId });
} catch (err) {
if (!(err instanceof Error)) {
err = new Error(err.result.message);
}
console.error(err.name, err.message);
}
})();
Après avoir exécuté ce code, inspectez le fichier de base de données importé avec l'extension Chrome DevTools OPFS Explorer. Il y a maintenant deux fichiers, l'un avec la base de données réelle et l'autre avec les informations de journalisation. Notez que ces deux fichiers résident dans le système de fichiers d'origine privé. Vous devez donc utiliser l'extension OPFS Explorer pour les afficher.
Pour vérifier que les données importées sont identiques aux données Web SQL initiales, cliquez sur le fichier mydatabase.db. L'extension OPFS Explorer affiche alors une boîte de dialogue Save File (Enregistrer le fichier) vous permettant d'enregistrer le fichier dans le système de fichiers visible par l'utilisateur. Une fois le fichier de base de données enregistré, explorez les données à l'aide d'une application de lecture SQLite. L'API Project Fugu propose plusieurs applications permettant de travailler avec SQLite dans le navigateur. Par exemple, Sqlime – SQLite Playground vous permet d'ouvrir un fichier de base de données SQLite à partir de votre disque dur et d'exécuter des requêtes sur la base de données. Comme le montre la capture d'écran ci-dessous, la table de pluie a été correctement importée dans SQLite.
Libérer de l'espace de stockage Web SQL
Bien qu'il soit (peut-être étonnamment) impossible de supprimer une base de données Web SQL, vous devriez toujours libérer de l'espace de stockage en supprimant les tables Web SQL désormais obsolètes après avoir migré les données vers SQLite Wasm. Pour répertorier toutes les tables d'une base de données Web SQL et les supprimer à l'aide de JavaScript, utilisez le code comme dans l'extrait de code suivant:
const dropAllTables = () => {
try {
db.transaction(function (tx) {
tx.executeSql(
"SELECT name FROM sqlite_master WHERE type='table' AND name !='__WebKitDatabaseInfoTable__'",
[],
function (tx, result) {
const len = result.rows.length;
const tableNames = [];
for (let i = 0; i < len; i++) {
const tableName = result.rows.item(i).name;
tableNames.push(`'${tableName}'`);
db.transaction(function (tx) {
tx.executeSql('DROP TABLE ' + tableName);
});
}
console.log(`Dropped table${tableNames.length > 1 ? 's' : ''}: ${tableNames.join(', ')}.`);
}
);
});
} catch (err) {
console.error(err.name, err.message);
}
};
Travailler avec les données après la migration
Une fois les données migrées, utilisez-les comme indiqué dans cet exemple de code pour démarrer. Pour en savoir plus, consultez la documentation de référence de l'API SQLite Wasm. Nous vous rappelons que vous devez accéder à SQLite Wasm à partir d'un nœud de calcul si vous utilisez le système de fichiers privé d'origine en tant que backend de stockage.
Effectuer un test
Cette démonstration vous permet de remplir une base de données Web SQL avec des exemples de données, puis de vider les données Web SQL sous forme d'instructions SQL, qui sont ensuite importées dans SQLite Wasm reposant sur le système de fichiers privé d'origine. Enfin, vous libérez de l'espace de stockage en supprimant les données Web SQL obsolètes. Vérifiez le code source pour l'implémentation complète, y compris le fichier mywebsqldump.js corrigé.
Conclusions
La migration de vos bases de données Web SQL vers SQLite Wasm reposant sur le système de fichiers d'origine privé est possible de manière transparente pour vos utilisateurs. Il ne remarquera pas que ses données sont désormais hébergées dans le système de fichiers privé d'origine d'une base de données SQLite et ne se trouvent plus dans Web SQL. Globalement, la migration de Web SQL vers SQLite est une étape nécessaire pour les développeurs Web qui souhaitent garantir la stabilité et l'évolutivité à long terme de leurs applications. Bien que le processus puisse nécessiter quelques efforts initiaux, l'investissement est largement justifié par une solution de base de données plus robuste, plus flexible et surtout évolutive.