Electron-开发实践：本地日志

【前言】

使用electron开发好本地应用后，

本地日志记录必不可少，

这样可以通过日志获取用户操作信息以及定位bug等，

本地日志与实时性的埋点上报稍微有不同，

本地日志量更大，信息更全，且不是所有信息都时候上报。

【与nodejs本地日志的异同】

electron写本地日志和nodejs写本地日志类似，

如果想自己封装，可以参考这篇文章： Node.js-WebServer开发实践：本地日志

不同点是

1. 初始化logger的时机

2. 渲染进程日志通过ipc传到主进程后记录到本地

【qiao-x-logger】

封装了一个npm包，欢迎使用： https://code.insistime.com/#/qiao-x-logger

初始化

建议在尽量早的时机初始化，这样可以记录更多的日志信息，

例如在electron入口js中第一行初始化，

// init
import { initLogger } from "qiao-x-logger";

// init logger
const loggerPath = path.resolve(app.getPath("logs"), "./electron.log");
initLogger(loggerPath);

主进程使用

主进程使用比较简单，如下

// logger
import { Logger } from "qiao-x-logger";
const logger = Logger("sips.js");

logger.info("iconutil", "success");

渲染进程使用

渲染进程使用需要通过ipc将日志传递到主进程后记录

1. 初始化主进程ipc监听

// log ipc
import { logIPCInit } from "qiao-x-logger";

logIPCInit();

2. preload相关代码

log-preload.js

// electron
import { ipcRenderer } from "electron";

/**
 * logIPC
 * @param {*} msg
 * @param {*} type debug,info,warn,error
 */
export const logIPC = (msg, type) => {
  ipcRenderer.send("ipc-log", { msg, type });
};

preload.js

// electron
import { contextBridge } from "electron";

// custom preload
import { logIPC } from "./log-preload.js";

// preload
contextBridge.exposeInMainWorld("electron", {
  logIPC,
});

3. 渲染进程使用

window.electron.logIPC(`selectPngPath filePath ${filePath}`, "info");

【效果】

写日志后会在logPath下生成日志文件，并按小时分割日志文件，

输出效果如下：