詳細(xì)了解SQL.js的基本特性
SQL，即結(jié)構(gòu)化查詢語言，是一種特定領(lǐng)域的語言，旨在訪問和操作關(guān)系數(shù)據(jù)庫中的數(shù)據(jù)。在SQL語句的幫助下，你可以在關(guān)系型數(shù)據(jù)庫上執(zhí)行創(chuàng)建、更新、檢索和刪除數(shù)據(jù)等操作。
關(guān)系數(shù)據(jù)庫是一種數(shù)據(jù)模型，它使用行和列將數(shù)據(jù)組織在一個(gè)表中。雖然可能有多個(gè)使用SQL的關(guān)系數(shù)據(jù)庫管理系統(tǒng)，但幾乎所有這些系統(tǒng)都被設(shè)計(jì)為服務(wù)器端進(jìn)程。其中包括：
- MySQL
- PostgreSQL
- SQLite
- MSSQL
在本教程中，我們將討論 SQL.js，這是一個(gè) JavaScript SQL 庫，可讓您完全在瀏覽器中創(chuàng)建和查詢關(guān)系數(shù)據(jù)庫。
我們將通過以下步驟，以每個(gè)部分的詳細(xì)例子來說明
- 什么是SQL.js?
- 使用SQL.js的利弊
- 安裝(瀏覽器和 Node.js)
- 編寫 SQL 查詢和準(zhǔn)備好的語句
什么是SQL.js?
SQL.js是一個(gè)JavaScript庫，允許你完全在瀏覽器中創(chuàng)建和查詢一個(gè)關(guān)系數(shù)據(jù)庫。它使用一個(gè)存儲(chǔ)在瀏覽器內(nèi)存中的虛擬數(shù)據(jù)庫文件，所以它不會(huì)持久化對(duì)數(shù)據(jù)庫的修改。
這個(gè)庫還使用Emscripten將SQLite編譯成WebAssembly (Wasm)。有了這個(gè)功能，你可以很容易地把現(xiàn)有的SQLite數(shù)據(jù)庫引入到SQL.js中使用，也可以把在SQL.js中創(chuàng)建的數(shù)據(jù)庫轉(zhuǎn)換成SQLite。
使用SQL.js的利弊
使用SQL.js有幾個(gè)好處。它是為客戶端建立的，并完全在客戶端工作，這意味著它不需要任何服務(wù)器端的進(jìn)程來工作。它比MySQL、PostgreSQL和其他需要第三方軟件才能使用的軟件更容易設(shè)置。開始使用SQL.js就像在一個(gè)現(xiàn)有的HTML項(xiàng)目中安裝jQuery一樣容易。而且SQL.js提供了對(duì)執(zhí)行包含多個(gè)語句的單個(gè)SQL字符串的支持，如下圖所示。
- sqlstr = "CREATE TABLE tableName(colA, colB);";
- sqlstr += "INSERT INTO hello VALUES (0, 'hello');"
- ....
但也有一個(gè)重要的缺點(diǎn)：使用 SQL.js 時(shí)對(duì)數(shù)據(jù)庫的更改不是持久的。再讀一遍：當(dāng)你重新加載瀏覽器時(shí)，對(duì)你的數(shù)據(jù)庫所做的所有改變都將不復(fù)存在。這是因?yàn)镾QL.js使用了一個(gè)存儲(chǔ)在瀏覽器內(nèi)存中的虛擬數(shù)據(jù)庫文件。然而，你可以導(dǎo)入任何現(xiàn)有的SQLite文件，并將創(chuàng)建的數(shù)據(jù)庫導(dǎo)出為一個(gè)JavaScript類型的數(shù)組。
安裝 SQL.js
(1) 瀏覽器安裝
將SQL.js整合到一個(gè)新的基于客戶端的項(xiàng)目中是非常容易的。你可以通過包括CDN或下載源文件并將其鏈接到你的標(biāo)記頁面來開始。
默認(rèn)情況下，SQL.js 使用 WebAssembly，除了 JavaScript 庫外，還需要加載 .wasm 文件。你可以在網(wǎng)上下載這個(gè)文件，并使用locateFile 功能在你的網(wǎng)頁中加載這個(gè)文件，像這樣。
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <title>Page Title</title>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/sql.js/1.5.0/sql-wasm.js"></script>
- <script>
- // Load sql.js WebAssembly file
- let config = {
- locateFile: () => "/path/to/downloaded/sql-wasm.wasm",
- };
- initSqlJs(config).then(function (SQL) {
- console.log("sql.js initialized ");
- });
- </script>
- </head>
- <body></body>
- </html>
在上面的代碼塊中，我們使用 initSqlJs 異步加載Wasm二進(jìn)制文件，并在加載所需文件后初始化SQL.js。
(2) Node.js安裝
在基于 Node 的項(xiàng)目中安裝 SQL.js 也非常簡(jiǎn)單。要安裝它，您只需運(yùn)行：
- npm install sql.js
或者，你可以從前面的鏈接中下載 sql-wasm.js 和 sql-wasm.wasm，并使用Node.js的 require 函數(shù)在你的項(xiàng)目中加載它們。
另外，在基于Node的項(xiàng)目中，你可以跳過 locateFile 方法來加載 sql-wasm.wasm文件，因?yàn)槿绻湍阏谔幚淼奈募谕粋€(gè)文件夾中，它將自動(dòng)加載。所以我們的代碼將看起來像這樣。
- var initSqlJs = require("./sql-wasm.js");
- initSqlJs().then(function (SQL) {
- console.log("sql.js initialized ");
- });
編寫 SQL 查詢和準(zhǔn)備好的語句
現(xiàn)在我們已經(jīng)完成了安裝和初始化 SQL.js 的所有必要步驟，讓我們深入了解它的用法。
(1) 創(chuàng)建數(shù)據(jù)庫
下面的代碼創(chuàng)建一個(gè)新的數(shù)據(jù)庫：
- const db = new SQL.Database();
值得注意的是，SQL.Database() 方法接受一個(gè)可選參數(shù) data，它必須是一個(gè)表示 SQLite 數(shù)據(jù)庫文件的 Uint8Array。例如，在 Node.js 中，我們可以加載一個(gè)現(xiàn)有的 .sqlite 文件，如下所示：
- let fs = require("fs");
- let initSqlJs = require("./sql-wasm.js");
- let filebuffer = fs.readFileSync("/path/to/sample.sqlite");
- initSqlJs().then(function (SQL) {
- // Create a new database with our existing sample.sqlite file
- const db = new SQL.Database(filebuffer);
- });
在上面的代碼中，我們使用內(nèi)置的 Node.js fs 和 path 模塊來讀取我們現(xiàn)有的 sample.sqlite 文件。
(2) 運(yùn)行 SQL 語句
SQL 語句可以是在數(shù)據(jù)庫中創(chuàng)建或檢索一條信息或?qū)ΜF(xiàn)有數(shù)據(jù)執(zhí)行操作的請(qǐng)求。
使用SQL.js，你可以很容易地運(yùn)行一個(gè)語句，而不讀取其結(jié)果。語法如下所示。
- db.run(stmt);
當(dāng)然，參數(shù) stmt 是你的SQL語句。下面是一個(gè)例子，說明如何在我們的數(shù)據(jù)庫中創(chuàng)建一個(gè)名為 users 的新表，其中有ID、姓名、電話號(hào)碼和地址等列。它還將在此表中插入一個(gè)新行。
- let initSqlJs = require("./sql-wasm.js");
- initSqlJs().then(function (SQL) {
- const db = new SQL.Database();
- // RUNNING SQL QUERIES
- db.run("CREATE TABLE users (id, name, phone, address);");
- db.run(
- `INSERT INTO users (id, name, phone, address)
- VALUES (1, 'John Doe', '+234-907788', '12 Igodan Street, Okitipupa')`
- );
- });
(3) 準(zhǔn)備好的 SQL 語句
你可以使用準(zhǔn)備好的語句來重復(fù)執(zhí)行相同或類似的SQL語句，而且效率很高。準(zhǔn)備好的語句比運(yùn)行中的SQL語句有更短的解析時(shí)間，因?yàn)閷?duì)查詢的準(zhǔn)備工作只做一次。它們對(duì)防止SQL注入也非常有用，因?yàn)槟悴恍枰D(zhuǎn)義參數(shù)值，這些參數(shù)值隨后會(huì)使用不同的協(xié)議傳輸。
使用 SQL.js，我們還可以使用 .prepare() 方法編寫準(zhǔn)備好的語句：
- var stmt = db.prepare(preparedStatement);
以下是在我們之前的數(shù)據(jù)庫中獲取 ID 介于 1 和 10 之間的所有用戶的示例：var stmt = db.prepare("SELECT * FROM users WHERE id BETWEEN $start AND $end");
- stmt.bind({ $start: 1, $end: 2 });
- while (stmt.step()) {
- var row = stmt.getAsObject();
- console.log("Here is a user row: " + JSON.stringify(row));
- }
在寫完我們準(zhǔn)備好的SQL語句后，我們使用 .bind() 方法來綁定我們的語句所需的值(上例中的 start 和 end )。繼續(xù)前進(jìn)，我們將使用一個(gè) while 循環(huán)來返回所有可能的行，并將它們記錄到控制臺(tái)。
(4) 將數(shù)據(jù)庫寫入磁盤
SQL.js還提供了一個(gè)選項(xiàng)，通過 db.export() 方法將數(shù)據(jù)庫導(dǎo)出/寫入磁盤，成為一個(gè) .sqlite 文件。結(jié)果將以 Uint8Array 形式返回，你可以使用Node.js Buffer 類和文件系統(tǒng)包將數(shù)據(jù)庫寫入磁盤。
- var fs = require("fs");
- /***
- Code to create a database here
- ***/
- // Export database
- var data = db.export();
- var buffer = new Buffer(data);
- fs.writeFileSync("new-db.sqlite", buffer);
運(yùn)行上面的代碼后，您應(yīng)該在項(xiàng)目根文件夾中看到一個(gè)名為 new-db.sqlite 的新文件。
總結(jié)
在本文中，我們介紹了 SQL.js、它提供的功能以及如何在實(shí)際應(yīng)用程序中使用它。雖然SQL.js可能非常適合構(gòu)建一個(gè)離線優(yōu)先的應(yīng)用程序，如記事本應(yīng)用程序，但在你想從管理面板管理用戶數(shù)據(jù)的情況下，你可能要考慮使用其他關(guān)系數(shù)據(jù)庫(MySQL、PostgreSQL)。
