前言

可能很多人都没有听说过这个lowdb,但是它的确存在,而且在electron 中用到还是挺多的。

如何在electron 的render 进程中是引用electron 模块。

我们知道一个问题,那就是app 模块是main 进程中特有的那么,render 进程中要使用必须这样:import { app, remote } from 'electron' // 引入remote模块

然后remote.app 这样使用即可。

所以我们在render中使用lowdb可以这样使用:

import Datastore from 'lowdb'

import FileSync from 'lowdb/adapters/FileSync'

import path from 'path'

import fs from 'fs-extra'

import { app, remote } from 'electron' // 引入remote模块

const APP = process.type === 'renderer' ? remote.app : app // 根据process.type来分辨在哪种模式使用哪种模块

const STORE_PATH = APP.getPath('userData') // 获取electron应用的用户目录

const adapter = new FileSync(path.join(STORE_PATH, '/data.json')) // 初始化lowdb读写的json文件名以及存储路径

const db = Datastore(adapter) // lowdb接管该文件

export default db // 暴露出去

开发模式和生产模式初始化路径问题

在开发模式的时候,通过 APP.getPath('userData') 获取到的路径形如: /Users/molunerfinn/Library/Application Support/Electron (macOS下)。这个是一个已经自动创建好的路径。所以在开发模式的时候,初始化路径是已经存在的。

然而在生产模式下不是这样。生产模式下,第一次打开应用的过程中, APP.getPath('userData') 获取的路径并未创建,而 datastore.js 却已经被加载。所以这个时候初始化路径并不存在。

所以我们必须在 datastore.js 里做一次路径是否存在的判断:

此处的fs是来自fs-extra模块

if (process.type !== 'renderer') {
if (!fs.pathExistsSync(STORE_PATH)) { // 如果不存在路径
fs.mkdirpSync(STORE_PATH) // 就创建
}
}

唯一标识的id字段

用过MySQL的人大多都会在表里初始化一个自增的id字段作为数据的唯一标识。而lowdb虽然无法很方便地创建一个自增的id字段,但是通过 lodash-id 这个插件可以很方便地为每个新增的数据自动加上一个唯一标识的id字段。

{
"height": 514,
"type": "weibo",
"width": 514,
"id": "7f247aa7-ffeb-4bb1-87f1-a0d69824ec78"
} 初始化也很方便: import LodashId from 'lodash-id'
const db = Datastore(adapter)
db._.mixin(LodashId) // 通过._mixin()引入

初始化完整代码

通过上述的踩坑,PicGo的初始化代码如下,仅供参考:

import Datastore from 'lowdb'
import LodashId from 'lodash-id'
import FileSync from 'lowdb/adapters/FileSync'
import path from 'path'
import fs from 'fs-extra'
import { remote, app } from 'electron' const APP = process.type === 'renderer' ? remote.app : app
const STORE_PATH = APP.getPath('userData') if (process.type !== 'renderer') {
if (!fs.pathExistsSync(STORE_PATH)) {
fs.mkdirpSync(STORE_PATH)
}
} const adapter = new FileSync(path.join(STORE_PATH, '/data.json')) const db = Datastore(adapter)
db._.mixin(LodashId) if (!db.has('uploaded').value()) {
db.set('uploaded', []).write()
} if (!db.has('picBed').value()) {
db.set('picBed', {
current: 'weibo'
}).write()
} if (!db.has('shortKey').value()) {
db.set('shortKey', {
upload: 'CommandOrControl+Shift+P'
}).write()
} export default db

不同进程读取的数据不一致。

lowdb在使用的过程中会遇到一个大坑在于,如果就按照基本操作,那么有可能出现我在 main 进程里存入的值,在 renderer 进程里读不到。

为啥?因为直接引用的 db 实际上只是那个时刻在内存里的数据。lowdb在使用过程中会把JSON数据读入内存中。只有在需要写操作的时候才会将新的数据写入磁盘。

db.read().get('xxx').value()

db.read().set('xxx', 'xxx')

为了避免这么麻烦呢,最后是前端的db传递给后端处理最为合适,不要搞两套。

lowdb 在electron 使用中注意的问题的更多相关文章

  1. electron 使用中的注意事项

    一.ELECTRON引用JQUERY.JS electron不能像正常的html文件引用jq.js那样(为嘛不造),elecron引用jq.js的方式为: <script>window.$ ...

  2. Vue 全家桶 + Electron 开发的一个跨三端的应用

    代码地址如下:http://www.demodashi.com/demo/11738.html GitHub Repo:vue-objccn Follow: halfrost · GitHub 利用 ...

  3. electron教程(四): 使用electron-builder或electron-packager将项目打包为可执行桌面程序(.exe)

    我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(二): http服务器, ws服务器, 子进程管理 electron教程(三): ...

  4. 大型Electron应用本地数据库技术选型

    开发一个大型Electron的应用,或许需要在客户端存储大量的数据,比如聊天应用或邮件客户端 可选的客户端数据库方案看似很多,但一一对比下来,最优解只有一个 接下来我们就一起来经历一下这个技术选型的过 ...

  5. 使用electron+vue开发一个跨平台todolist(便签)桌面应用

    # 1 最近一直在使用electron开发桌面应用,对于一个web开发者来说,html+javascript+css的开发体验让我非常舒服.之前我一直简单的以为electron只是张网页加个壳,和那些 ...

  6. 【electron+vue3+ts实战便笺exe】一、搭建框架配置

    不要让自己的上限成为你的底线 前言 诈尸更新系列,为了跟上脚步,尝试了vue3,在学习vue3的时候顺便学习一手electron和ts,本教程将分别发布,源码会在最后的文章发布.因为还在开发中,目前也 ...

  7. electron 应用开发优秀实践

    vivo 互联网前端团队-Yang Kun 一.背景 在团队中,我们因业务发展,需要用到桌面端技术,如离线可用.调用桌面系统能力.什么是桌面端开发?一句话概括就是:以 Windows .macOS 和 ...

  8. 基于electron+vue+element构建项目模板之【打包篇】

    1.概述 开发平台OS:windows 开发平台IDE:vs code 本项目使用了一款Vue-CLI插件(vue-cli-plugin-electron-builder) 来构建 electron ...

  9. Electron使用与学习--(页面间的通信)

    目录结构: index.js是主进程js. const electron = require('electron') const app = electron.app const BrowserWin ...

  10. Electron使用与学习--(基本使用与菜单操作)

    对于electron是个新手,下面纯属个人理解.如有错误,欢迎指出.   一.安装 如果你本地按照github上的 # Install the `electron` command globally ...

随机推荐

  1. sentinel的见解

    Sentinel 是面向分布式.多语言异构化服务架构的流量治理组件,主要以流量为切入点,从流量控制.熔断降级.热点流量防护等多个维度来帮助开发者保障微服务的稳定性.   在 Sentinel 里面,所 ...

  2. 19 SWERC 2022-2023 - Online Mirror (Unrated, ICPC Rules, Teams Preferred)L. Controllers(数学公式+瞎搞)

    L. Controllers 思路: #include <bits/stdc++.h> #define int long long #define rep(i, a, b) for(int ...

  3. 十步带你用IDEA创建一个WEB项目及部署(Tomcat)

    部署一个web项目首先需要安装Tomcat,还没安装的朋友们可以看一下我这个博客: https://www.cnblogs.com/deyo/p/17241878.html 第一步:打开Idea-新建 ...

  4. 词根 ten 展开 持有 /tin/tent/tain “to hold”

    词根 ten 展开 持有 /tin/tent/tain "to hold" 记忆方式:en是拿出.忘了从哪里看的了.t是动作过去. 如果是 过去的时候已经拿出来,那就是 展开 延展 ...

  5. Apollo3 Blue SoC 和 Apollo3 Blue Plus SoC的区别

    一 芯片简介 1.简介 Apollo3 Blue系列SoC解决方案代表了超低功耗设计的巨大飞跃,其运行模式和睡眠模式下的功耗数值均十分出色,并且具有高性能的处理引擎. Apollo3Blue器件提供了 ...

  6. 应用层01-HTTP

    2.1 应用层协议原理 2.1.1 网络应用程序体系结构 研发网络应用的程序的核心是写出能够运行在不同的端系统和通过网络彼此通信的程序. 例如: Web应用程序 客户:浏览器程序(进程) 服务:Web ...

  7. springboot如何优雅的获取前端参数

    写在前面 对于初学者来说,困难的不是理论知识,而是如何在程序中具体实现. 现在的项目基本上都是前后端分离的项目,如何打通前后端,接收前端传过来的参数呢? 废话不多说,这篇文章就来说一说接收前端参数的具 ...

  8. 3DCAT 首届行业生态交流会 | 瑞云科技技术总监赵志杰:实时渲染助力元宇宙应用触手可及

    2021 年 12 月 17 日下午,由深圳市瑞云科技有限公司主办,深圳市虚拟现实产业联合会协办的云 XR 如何赋能元宇宙--3DCAT实时云渲染首届行业生态合作交流会圆满落幕.此次活动围绕 &quo ...

  9. django(ORM)

    一 单表(增.删.改.查) 1 测试脚本 ''' 只想测试django中的某一个py文件内容,那么可以不用书写前后端交互的形式 而是直接写一个测试脚本即可 ''' # 脚本代码无论是写在应用下的tes ...

  10. re_signin 【ctfshow_元旦水友赛】Reserve

    题目: IDA反编译 主函数 1 int __cdecl main(int argc, const char **argv, const char **envp) 2 { 3 char s2[144] ...