Từ Web SQL sang SQLite Wasm: hướng dẫn di chuyển cơ sở dữ liệu

Với SQLite Wasm được hệ thống tệp riêng tư gốc hỗ trợ, có một giải pháp thay thế linh hoạt cho công nghệ cơ sở dữ liệu Web SQL không dùng nữa. Bài viết này là hướng dẫn về cách di chuyển dữ liệu từ Web SQL sang SQLite Wasm.

Thông tin cơ bản bắt buộc

Bài đăng Giảm giá và xoá SQL web đã thông báo về việc ngừng sử dụng công nghệ cơ sở dữ liệu Web SQL. Mặc dù công nghệ này có thể sẽ không được dùng nữa, nhưng những trường hợp sử dụng mà công nghệ xử lý thì không. Do đó, bài đăng tiếp theo SQLite Wasm trên trình duyệt được Hệ thống tệp riêng tư gốc trình bày một loạt công nghệ thay thế dựa trên cơ sở dữ liệu SQLite, được biên dịch thành Web bụi (wasm) và được hệ thống tệp riêng tư gốc hỗ trợ. Để khép lại vòng tròn, bài viết này sẽ hướng dẫn cách di chuyển cơ sở dữ liệu từ Web SQL sang SQLite Wasm.

Di chuyển cơ sở dữ liệu

Bốn bước sau đây minh hoạ ý tưởng khái niệm về việc di chuyển cơ sở dữ liệu Web SQL sang SQLite Wasm, với cơ sở dữ liệu SQLite được hệ thống tệp riêng tư gốc hỗ trợ. Đây có thể là nền tảng cho mã của riêng bạn, được tuỳ chỉnh theo nhu cầu di chuyển Web SQL của bạn.

(Các) cơ sở dữ liệu Web SQL sẽ được di chuyển

Giả định cơ sở của hướng dẫn di chuyển này là bạn hiện có một (hoặc nhiều) cơ sở dữ liệu Web SQL chứa dữ liệu liên quan đến ứng dụng của mình. Trong ảnh chụp màn hình dưới đây, bạn sẽ thấy một cơ sở dữ liệu mẫu có tên là mydatabase với một bảng dữ liệu về mưa bão liên kết tâm trạng với mức độ nghiêm trọng. Công cụ của Chrome cho nhà phát triển cho phép bạn xem cơ sở dữ liệu Web SQL để gỡ lỗi, như trong ảnh chụp màn hình sau đây.

Đã kiểm tra cơ sở dữ liệu Web SQL trong Công cụ cho nhà phát triển của Chrome. Cơ sở dữ liệu này có tên là mydatabase và lưu trữ một bảng có 3 cột: mã hàng, tâm trạng và mức độ nghiêm trọng. Có 3 hàng dữ liệu mẫu.

Dịch cơ sở dữ liệu Web SQL sang câu lệnh SQL

Để di chuyển dữ liệu theo cách minh bạch cho người dùng, tức là không yêu cầu họ phải tự thực hiện bất kỳ bước di chuyển nào, các phần dữ liệu trong cơ sở dữ liệu cần được dịch ngược về câu lệnh SQL ban đầu đã tạo chúng lúc ban đầu. Thách thức này đã từng xuất hiện và tập lệnh di chuyển được dùng trong bài viết này (mywebsqldump.js) dựa trên một thư viện cộng đồng có tên là websqldump.js, kèm theo một số điều chỉnh nhỏ. Mã mẫu sau đây cho thấy mã cần thiết để dịch cơ sở dữ liệu Web SQL mydatabase sang một tập hợp câu lệnh SQL.

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

Việc chạy mã này sẽ dẫn đến chuỗi câu lệnh SQL bên dưới.

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

Nhập dữ liệu vào SQLite Wasm

Tất cả những gì còn lại là thực thi các lệnh SQL này trong ngữ cảnh SQLite Wasm. Để biết toàn bộ thông tin về cách thiết lập SQLite Wasm, tôi xin tham khảo bài viết SQLite Wasm trong trình duyệt được Hệ thống tệp riêng tư gốc hỗ trợ, nhưng ý chính lại được trình bày ở bên dưới. Hãy nhớ rằng mã này cần chạy trong Worker (mà thư viện tự động tạo cho bạn) với tiêu đề HTTP bắt buộc được đặt chính xác. Bạn có thể cài đặt gói @sqlite.org/sqlite-wasm từ 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);
  }
})();

Sau khi chạy mã này, hãy kiểm tra tệp cơ sở dữ liệu đã nhập bằng tiện ích OPFS Explorer của Chrome cho nhà phát triển. Hiện có hai tệp, một tệp chứa cơ sở dữ liệu thực tế và một tệp có thông tin ghi nhật ký. Lưu ý rằng hai tệp này nằm trong hệ thống tệp riêng tư ở nguồn gốc, vì vậy, bạn cần sử dụng tiện ích OPFS Explorer để xem chúng.

Kiểm tra hệ thống tệp gốc riêng tư bằng Công cụ cho nhà phát triển của Chrome dành cho OPFS Explorer. Có hai tệp, một tệp có tên là mydatabase.db và một tệp có tên là mydatabase.db-journal.

Để thực sự xác minh rằng dữ liệu đã nhập giống với dữ liệu Web SQL ban đầu, hãy nhấp vào tệp mydatabase.db và tiện ích OPFS Explorer sẽ hiển thị hộp thoại Save File (Lưu tệp) để cho phép bạn lưu tệp trong hệ thống tệp mà người dùng thấy được. Sau khi lưu tệp cơ sở dữ liệu, hãy sử dụng ứng dụng trình xem SQLite để khám phá dữ liệu. Trưng bày API của Project Fugu giới thiệu một số ứng dụng để làm việc với SQLite trong trình duyệt. Ví dụ: Sqlime — SQLite Playground cho phép bạn mở tệp cơ sở dữ liệu SQLite qua ổ đĩa cứng và chạy truy vấn trên cơ sở dữ liệu đó. Như bạn thấy trong ảnh chụp màn hình bên dưới, bảng mưa bão đã được nhập chính xác vào SQLite.

Khám phá tệp mydatabase.db trong công cụ Sqlime SQLite Playground. Ứng dụng hiển thị với truy vấn SQL Select star from Mưa bão giới hạn 10 được chạy, dẫn đến 3 hàng từ dữ liệu mẫu ban đầu từ Web SQL.

Giải phóng bộ nhớ Web SQL

Mặc dù không thể xoá cơ sở dữ liệu Web SQL (có thể gây bất ngờ), nhưng bạn vẫn nên giải phóng bộ nhớ bằng cách xoá các bảng Web SQL đã lỗi thời sau khi đã di chuyển dữ liệu vào SQLite Wasm. Để liệt kê tất cả bảng trong cơ sở dữ liệu Web SQL và xoá các bảng đó bằng JavaScript, hãy dùng mã như trong đoạn mã sau:

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

Làm việc với dữ liệu sau khi di chuyển

Sau khi bạn di chuyển dữ liệu, hãy làm việc với dữ liệu như đã nêu trong mã mẫu bắt đầu này. Hãy xem Tài liệu tham khảo về API SQLite Wasm để biết thông tin chi tiết. Xin nhắc lại rằng bạn cần truy cập vào SQLite Wasm từ một Worker nếu sử dụng hệ thống tệp riêng tư theo nguyên gốc làm phần phụ trợ bộ nhớ.

Dùng thử

Bản minh hoạ này cho phép bạn điền sẵn dữ liệu mẫu vào cơ sở dữ liệu Web SQL, sau đó kết xuất dữ liệu Web SQL dưới dạng câu lệnh SQL. Sau đó, dữ liệu này sẽ được nhập vào SQLite Wasm được hệ thống tệp riêng tư gốc hỗ trợ. Cuối cùng, bạn hãy giải phóng dung lượng lưu trữ bằng cách xoá dữ liệu Web SQL đã lỗi thời. Hãy kiểm tra mã nguồn để biết quy trình triển khai đầy đủ, bao gồm cả tệp mywebsqldump.js đã vá.

Ứng dụng minh hoạ tại web-sql-to-sqlite-wasm.glitch.me.

Kết luận

Bạn có thể di chuyển cơ sở dữ liệu Web SQL sang SQLite Wasm được hệ thống tệp riêng tư gốc hỗ trợ theo cách minh bạch đối với người dùng. Họ sẽ không nhận thấy rằng dữ liệu của họ hiện được lưu trữ trong hệ thống tệp riêng tư gốc trong cơ sở dữ liệu SQLite và không còn tồn tại trong Web SQL. Nhìn chung, việc di chuyển từ Web SQL sang SQLite là một bước cần thiết đối với những nhà phát triển web muốn đảm bảo tính ổn định lâu dài và khả năng có thể mở rộng cho ứng dụng của họ. Mặc dù quy trình này có thể đòi hỏi một số nỗ lực ban đầu, nhưng lợi ích của một giải pháp cơ sở dữ liệu mạnh mẽ, linh hoạt hơn và trên hết là phù hợp với tương lai khiến công việc này xứng đáng với việc đầu tư.