最近看到一个使用js来操作sqlite数据库的,测试了一下,具体使用的是
js操作类: https://github.com/kripken/sql.js/(sqlite js 驱动)
异步请求:http://npm.taobao.org/package/axios(异步请求插件,只有12.6k)
这里使用的js驱动是和服务器端使用方法一致,sql标准语法都支持,可以用第三方管理工具来管理数据文件
目前我使用的是 Navicat Premium 12
。
1. 数据库sql(自己运行生成test.db,和html页面放在同一目录下):
PRAGMA foreign_keys = false; -- ---------------------------- -- Table structure for sys_user -- ---------------------------- DROP TABLE IF EXISTS "sys_user"; CREATE TABLE "sys_user" ( "id" bigint(11) NOT NULL, "role_id" bigint(11) NOT NULL, "user_name" varchar(255) NOT NULL, "user_pass" varchar(64) NOT NULL, "nick_name" varchar(255) NOT NULL, "register_time" datetime NOT NULL, "status" int(11) NOT NULL DEFAULT 1, "sort" decimal(16,2) NOT NULL DEFAULT 0.00, PRIMARY KEY ("id") ) WITHOUT ROWID; -- ---------------------------- -- Records of sys_user -- ---------------------------- INSERT INTO "sys_user" VALUES (1, 1, 'lxw', 123456, '李兴武', '2019-01-07 11:22:30', 0, 1); INSERT INTO "sys_user" VALUES (2, 1, 'lwq', 123456, '浏览器', '2019-01-08 11:11:11', 0, 2); INSERT INTO "sys_user" VALUES (3, 1, 'tjun', 123123, '田俊', '2018-01-01 12:22:35', 1, 3); INSERT INTO "sys_user" VALUES (4, 1, 'tttt', 123456, '通天塔', '', 1, 4); -- ---------------------------- -- Indexes structure for table sys_user -- ---------------------------- CREATE UNIQUE INDEX "pk" ON "sys_user" ( "id" COLLATE BINARY ASC ); PRAGMA foreign_keys = true;
2. html(可直接复制下来运行)
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <title>sqlite数据库测试</title> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <script src="https://cdn.bootcss.com/sql.js/0.5.0/js/sql-optimized.js"></script> </head> <body> <p>sqlite数据库测试,使用js操作sqlite数据库</p> <p>这里使用axios读取test.db文件,进行初始化数据库连接,</p> <p>查询速度不快,除非不想写后台要直接操作数据库,不然没什么用。</p> <p>具体效果可查看代码和控制台打印的数据。</p> <script> // 读取数据库数据 axios.get("test.db", {responseType: 'arraybuffer'}) .then(function (response) { let db = new window.SQL.Database(new Uint8Array(response.data)); // 执行查询 let s = new Date().getTime(); let r = db.exec("SELECT * FROM sys_user WHERE status = 1;"); let e = new Date().getTime(); console.info("查询数据耗时:" + (e - s) + "ms"); // 解析数据 let obj = dbToObj(r); console.info(obj); }) .catch(function (error) { console.info(error); }); // 方法传入两个数组,第一个数组为key,第二个数组对应位置为value,此方法在Python中为zip()函数。 const ArraytoObj = (keys = [], values = []) => { if (keys.length === 0 || values.length === 0) return {}; const len = keys.length > values.length ? values.length : keys.length; const obj = {}; for (let i = 0; i < len; ++i) { obj[keys[i]] = values[i] } return obj; }; // 转驼峰表示:func.camel('USER_ROLE',true) => UserRole // 转驼峰表示:func.camel('USER_ROLE',false) => userRole const camel = (str, firstUpper = false) => { let ret = str.toLowerCase(); ret = ret.replace(/_([\w+])/g, function (all, letter) { return letter.toUpperCase(); }); if (firstUpper) { ret = ret.replace(/\b(\w)(\w*)/g, function ($0, $1, $2) { return $1.toUpperCase() + $2; }); } return ret; }; // 把数组里面的所有转化为驼峰命名 const camelArr = (arrs = []) => { let _arrs = []; arrs.map(function (item) { _arrs.push(camel(item)); }); return _arrs; }; // 读取数据库 // 1.把columns转化为驼峰; // 2.把columns和values进行组合; const dbToObj = (_data = {}) => { let _res = []; _data.map(function (item) { let _columns = camelArr(item.columns); item.values.map(function (values) { _res.push(ArraytoObj(_columns, values)); }); }); return _res; }; </script> </body> </html>
原路径 https://www.cnblogs.com/lixingwu/p/10236640.html