当前位置：码云笔记 > 前端 > 使用SQL.js在浏览器中实现创建和查询一个关系数据库
空山新雨⁣空山新雨⁣ 前端

使用SQL.js在浏览器中实现创建和查询一个关系数据库

AI 概述
什么是 SQL.js？使用 SQL.js 的利弊安装 SQL.js浏览器安装Node.js 安装编写 SQL 查询和准备好的语句创建数据库运行 SQL 语句准备好的 SQL 语句将数据库写入磁盘总结 SQL，即结构化查询语言，是一种特定领域的语言，旨在访问和操作关系数据库中的数据。在 SQL 语句的帮助下，你可以在关系型数据库上执...
目录
文章目录隐藏
  1. 什么是 SQL.js？
  2. 使用 SQL.js 的利弊
  3. 安装 SQL.js
  4. 编写 SQL 查询和准备好的语句
  5. 总结

使用 SQL.js 在浏览器中实现创建和查询一个关系数据库

SQL，即结构化查询语言，是一种特定领域的语言，旨在访问和操作关系数据库中的数据。在 SQL 语句的帮助下，你可以在关系型数据库上执行创建、更新、检索和删除数据等操作。

关系数据库是一种数据模型，它使用行和列将数据组织在一个表中。虽然可能有多个使用 SQL 的关系数据库管理系统，但几乎所有这些系统都被设计为服务器端进程。其中包括：

  • MySQL
  • PostgreSQL
  • SQLite
  • MSSQL

在本教程中，我们将讨论 SQL.js，这是一个 JavaScript SQL 库，可让您完全在浏览器中创建和查询关系数据库。

我们将通过以下步骤，以每个部分的详细例子来说明

  • 什么是 SQL.js？
  • 使用 SQL.js 的利弊
  • 安装（浏览器和 Node.js）
  • 编写 SQL 查询和准备好的语句

什么是 SQL.js？

SQL.js 是一个 JavaScript 库，允许你完全在浏览器中创建和查询一个关系数据库。它使用一个存储在浏览器内存中的虚拟数据库文件，所以它不会持久化对数据库的修改。

这个库还使用Emscripten将 SQLite 编译成WebAssembly (Wasm)。有了这个功能，你可以很容易地把现有的 SQLite 数据库引入到 SQL.js 中使用，也可以把在 SQL.js 中创建的数据库转换成 SQLite。

使用 SQL.js 的利弊

使用 SQL.js 有几个好处。它是为客户端建立的，并完全在客户端工作，这意味着它不需要任何服务器端的进程来工作。它比 MySQL、PostgreSQL 和其他需要第三方软件才能使用的软件更容易设置。开始使用 SQL.js 就像在一个现有的 HTML 项目中安装 jQuery 一样容易。而且 SQL.js 提供了对执行包含多个语句的单个 SQL 字符串的支持，如下所示。

sqlstr = "CREATE TABLE tableName(colA, colB);";
sqlstr += "INSERT INTO hello VALUES (0, 'hello');"
    ....

但也有一个重要的缺点：使用 SQL.js 时对数据库的更改不是持久的。再读一遍：当你重新加载浏览器时，对你的数据库所做的所有改变都将不复存在。这是因为 SQL.js 使用了一个存储在浏览器内存中的虚拟数据库文件。然而，你可以导入任何现有的 SQLite 文件，并将创建的数据库导出为一个 JavaScript 类型的数组。

安装 SQL.js

浏览器安装

将 SQL.js 整合到一个新的基于客户端的项目中是非常容易的。你可以通过包括 CDN 或下载源文件并将其链接到你的标记页面来开始。

默认情况下，SQL.js 使用 WebAssembly，除了 JavaScript 库外，还需要加载 .wasm 文件。你可以在网上下载这个文件，并使用locateFile 功能在你的网页中加载这个文件，像这样。

<!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 二进制文件，并在加载所需文件后初始化 SQL.js。

Node.js 安装

在基于 Node 的项目中安装 SQL.js 也非常简单。要安装它，您只需运行：

npm install sql.js

或者，你可以从前面的链接中下载 sql-wasm.js 和 sql-wasm.wasm，并使用 Node.js 的 require 函数在你的项目中加载它们。

另外，在基于 Node 的项目中，你可以跳过 locateFile 方法来加载 sql-wasm.wasm 文件，因为如果它和你正在处理的文件在同一个文件夹中，它将自动加载。所以我们的代码将看起来像这样。

var initSqlJs = require("./sql-wasm.js");

initSqlJs().then(function (SQL) {
  console.log("sql.js initialized 🎉");
});

编写 SQL 查询和准备好的语句

现在我们已经完成了安装和初始化 SQL.js 的所有必要步骤，让我们深入了解它的用法。

创建数据库

下面的代码创建一个新的数据库：

const db = new SQL.Database();

值得注意的是，SQL.Database() 方法接受一个可选参数 data，它必须是一个表示 SQLite 数据库文件的 Uint8Array。例如，在 Node.js 中，我们可以加载一个现有的 .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);
});

在上面的代码中，我们使用内置的 Node.js fs 和 path 模块来读取我们现有的 sample.sqlite 文件。

运行 SQL 语句

SQL 语句可以是在数据库中创建或检索一条信息或对现有数据执行操作的请求。

使用 SQL.js，你可以很容易地运行一个语句，而不读取其结果。语法如下所示。

db.run(stmt);

当然，参数 stmt 是你的 SQL 语句。下面是一个例子，说明如何在我们的数据库中创建一个名为 users 的新表，其中有 ID、姓名、电话号码和地址等列。它还将在此表中插入一个新行。

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

准备好的 SQL 语句

你可以使用准备好的语句来重复执行相同或类似的 SQL 语句，而且效率很高。准备好的语句比运行中的 SQL 语句有更短的解析时间，因为对查询的准备工作只做一次。它们对防止 SQL 注入也非常有用，因为你不需要转义参数值，这些参数值随后会使用不同的协议传输。

使用 SQL.js，我们还可以使用 .prepare() 方法编写准备好的语句：

var stmt = db.prepare(preparedStatement);

以下是在我们之前的数据库中获取 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));
}

在写完我们准备好的 SQL 语句后，我们使用 .bind() 方法来绑定我们的语句所需的值（上例中的 start 和 end ）。继续前进，我们将使用一个 while 循环来返回所有可能的行，并将它们记录到控制台。

将数据库写入磁盘

SQL.js 还提供了一个选项，通过 db.export() 方法将数据库导出/写入磁盘，成为一个 .sqlite 文件。结果将以 Uint8Array 形式返回，你可以使用 Node.js Buffer 类和文件系统包将数据库写入磁盘。

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

总结

在本文中，我们介绍了 SQL.js、它提供的功能以及如何在实际应用程序中使用它。虽然 SQL.js 可能非常适合构建一个离线优先的应用程序，如记事本应用程序，但在你想从管理面板管理用户数据的情况下，你可能要考虑使用其他关系数据库（MySQL、PostgreSQL）。

以上关于使用SQL.js在浏览器中实现创建和查询一个关系数据库的文章就介绍到这了，更多相关内容请搜索码云笔记以前的文章或继续浏览下面的相关文章，希望大家以后多多支持码云笔记。

「点点赞赏，手留余香」

赞 0 赏

给作者打赏，鼓励TA抓紧创作！

微信微信 支付宝支付宝

还没有人赞赏，快来当第一个赞赏的人吧！

声明：本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若内容造成侵权/违法违规/事实不符，请将相关资料发送至 admin@mybj123.com 进行投诉反馈，一经查实，立即处理！
重要：如软件存在付费、会员、充值等，均属软件开发者或所属公司行为，与本站无关，网友需自行判断
码云笔记 » 使用SQL.js在浏览器中实现创建和查询一个关系数据库

空山新雨⁣ 普通

分享到：

相关推荐

发表回复