Web SQL'den SQLite Wasm'a: Veritabanı taşıma kılavuzu

Kaynak özel dosya sistemi tarafından desteklenen SQLite Wasm ile, kullanımdan kaldırılan Web SQL veritabanı teknolojisinin çok yönlü bir alternatifi mevcuttur. Bu makale, verilerinizi Web SQL'den SQLite Wasm'a taşımayla ilgili bir kılavuzdur.

Gerekli arka plan

Web SQL'in kullanımdan kaldırılması ve kaldırılması başlıklı makalede, Web SQL veritabanı teknolojisinin kullanımdan kaldırıldığını duyuruldu. Teknolojinin kendisi kullanımdan kaldırılmış olsa da bu teknolojinin ele aldığı kullanım alanları çok fazla değildir. Bu nedenle, Kaynak Özel Dosya Sistemi tarafından desteklenen tarayıcıdaki SQLite Wasm'ın takip yayınında, SQLite veritabanına dayalı, Web Assembly'de (Wasm) derlenen ve kaynak özel dosya sistemi tarafından desteklenen bir dizi alternatif teknoloji sunulmuştur. Daireyi kapatmak için bu makalede veritabanlarının Web SQL'den SQLite Wasm'a nasıl taşınacağı gösterilmektedir.

Veritabanlarınızı taşıma

Aşağıdaki dört adım, kaynak özel dosya sistemi tarafından desteklenen SQLite veritabanı ile bir Web SQL veritabanını SQLite Wasm'a taşımaya dair kavramsal fikri göstermektedir. Bu, Web SQL taşıma ihtiyaçlarınıza göre özelleştirilmiş kendi kodunuz için bir temel oluşturabilir.

Taşınacak Web SQL veritabanı

Bu taşıma rehberindeki temel varsayım, uygulamanızla ilgili verileri içeren bir (veya birkaç) mevcut Web SQL veritabanınızın olduğudur. Aşağıdaki ekran görüntüsünde, ruh hallerini önem dereceleriyle eşleştiren yağmur fırtınası tablosuna sahip veritabanım adlı örnek bir veritabanı görüyorsunuz. Chrome Geliştirici Araçları, aşağıdaki ekran görüntüsünde gösterildiği gibi hata ayıklama için Web SQL veritabanlarını görüntülemenize olanak tanır.

Web SQL veritabanını SQL ifadelerine çevirme

Verileri kullanıcı açısından şeffaf bir şekilde, yani taşıma adımlarının herhangi birini kendi kendilerine gerçekleştirmelerini gerektirmeden taşımak için veritabanındaki verilerin en başta onları oluşturan orijinal SQL ifadelerine geri dönüştürülmesi gerekir. Bu zorluk daha önce de ortaya çıkmıştı. Bu makalede kullanılan taşıma komut dosyası (mywebsqldump.js), websqldump.js adlı bir topluluk kitaplığını temel alıyor ve bazı küçük düzenlemeler yapıldı. Aşağıdaki kod örneğinde, mydatabase web SQL veritabanını bir dizi SQL ifadesine çevirmek için gereken kod gösterilmektedir.

websqldump.export({
  database: 'mydatabase',
  version: '1.0',
  success: function(sql) {
    // The SQL statements.
  },
  error: function(err) {
    // Handle the error.
  }
});

Bu kod çalıştırıldığında aşağıdaki SQL ifadeleri dizesi oluşturulur.

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');

bulunan köşe örnekleriyle doğru şekilde başa çıkması için mywebsqldump.js ürününe daha fazla yama uygulamanız gerekebilir.

Verileri SQLite Wasm'a aktarma

Geriye kalan tek şey bu SQL komutlarını SQLite Wasm bağlamında yürütmektir. SQLite Wasm kurulumuyla ilgili tüm ayrıntılar için Kaynak Özel Dosya Sistemi tarafından desteklenen tarayıcıdaki SQLite Wasm makalesini inceleyin. Genel bilgi aşağıda verilmiştir. Bu kodun, gerekli HTTP üstbilgileri doğru ayarlanmış şekilde bir Çalışanda (kitaplığın sizin için otomatik olarak oluşturduğu) çalışması gerektiğini unutmayın. @sqlite.org/sqlite-wasm paketini npm'den yükleyebilirsiniz.

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);
  }
})();

Bu kodu çalıştırdıktan sonra, içe aktarılan veritabanı dosyasını OPFS Explorer Chrome Geliştirici Araçları uzantısıyla inceleyin. Şu anda biri gerçek veritabanını, diğeri günlük kaydı bilgilerini içeren iki dosya var. Bu iki dosyanın kaynak özel dosya sisteminde bulunduğunu, dolayısıyla bunları görmek için OPFS Explorer uzantısını kullanmanız gerektiğini unutmayın.

İçe aktarılan verilerin ilk Web SQL verileriyle aynı olduğunu doğrulamak için mydatabase.db dosyasını tıklayın. OPFS Explorer uzantısı, dosyayı kullanıcının görebildiği dosya sistemine kaydetmenizi sağlayan bir Dosyayı Kaydet iletişim kutusu gösterir. Veritabanı dosyası kaydedildikten sonra, verileri keşfetmek için bir SQLite görüntüleyici uygulaması kullanın. Project Fugu API Vitrini'nde tarayıcıda SQLite ile çalışmaya yönelik çeşitli uygulamalar bulunur. Örneğin, Sqlime — SQLite Playground'u kullanarak sabit diskinizden SQLite veritabanı dosyası açabilir ve veritabanında sorgu çalıştırabilirsiniz. Aşağıdaki ekran görüntüsünde görebileceğiniz gibi yağmur fırtınası tablosu SQLite'a doğru şekilde aktarılmıştır.

Web SQL depolama alanında yer açma

Bir Web SQL veritabanını silmek (beklenmedik şekilde) mümkün olsa da, verileri SQLite Wasm'a taşıdıktan sonra eski olan Web SQL tablolarını çıkararak bir miktar depolama alanı boşaltmanız gerekir. Bir Web SQL veritabanındaki tüm tabloları listelemek ve JavaScript kullanarak bırakmak için aşağıdaki snippet'teki kodu kullanın:

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);
  }
};

Taşıma işleminden sonra verilerle çalışma

Verileri taşıdıktan sonra, bu Başlangıç kodu örneğinde açıklanan şekilde verilerle çalışın. Ayrıntılar için SQLite Wasm API referansına bakın. Depolama arka ucu olarak kaynak gizli dosya sistemini kullanıyorsanız SQLite Wasm'a bir çalışandan erişmeniz gerektiğini tekrar hatırlatmak isteriz.

Test edin

Bu demo, Web SQL veritabanını örnek verilerle doldurmanızı, ardından Web SQL verilerini SQL ifadeleri olarak almanızı sağlar. Bu ifadeler daha sonra kaynak özel dosya sistemi tarafından desteklenen SQLite Wasm'a aktarılır. Son olarak, eski Web SQL verilerini silerek yer açarsınız. Yama uygulanmış mywebsqldump.js dosyası da dahil olmak üzere tam uygulama için kaynak kodu kontrol edin.

Sonuçlar

Web SQL veritabanlarınızı kaynak özel dosya sistemi tarafından desteklenen SQLite Wasm'a kullanıcılarınız için şeffaf bir şekilde taşıyabilirsiniz. Verilerinin artık bir SQLite veritabanındaki kaynak özel dosya sisteminde barındırıldığını ve Web SQL'de bulunmadığını fark etmezler. Genel olarak Web SQL'den SQLite'a geçiş, uygulamalarının uzun vadeli kararlılığını ve ölçeklenebilirliğini sağlamak isteyen web geliştiricileri için gerekli bir adımdır. Bu süreç başlangıçta biraz çaba gerektirmekle birlikte, daha güçlü, esnek ve hepsinden önemlisi, geleceğe hazır bir veritabanı çözümünün avantajları bu yatırıma değecektir.