Vue3 Electron 获取用户文档文件夹

Question

如何获取桌面上 Electron 应用运行的用户文档文件夹路径。我已尝试以下操作，但收到 app is undefined.

错误

import fs from "fs";
const { app } = require("electron");

export function getFilepath() {
  const filepath = app.getPath("userData") + "/settings.json";
  return filepath;
}

此代码位于 helpers.js 文件中，该文件正在通过我的 electron_preload.js 文件导入。

我不知道如何解决这个问题。

import { contextBridge, ipcRenderer } from "electron";
const helpers= require("../src/helpers");

contextBridge.exposeInMainWorld("helpers", helpers);

Answer 1

由于您是在预加载环境中执行代码，因此它在相应 BrowserWindow 的渲染器进程中运行。但是，app 仅限于主进程的执行范围 (source)，这就是您的代码抛出错误的原因。

您将必须通过 IPC 公开路径。

// Main process, app.js or whatever
const { ipcMain, app } = require ("electron");

ipcMain.handle ("get-user-data-path", (event, ...args) => {
    return app.getPath ("userData") + "/settings.json";
});

// In helpers.js
import fs from "fs";
const { ipcRenderer } = require("electron");

export async function getFilepath () {
    return await ipcRenderer.invoke ("get-user-data-path");
}

更多in-depth解释，请看官方Electron IPC tutorial。

（附带说明：I/O 到文件系统可能应该由主进程完成，而不是渲染器。从安全的角度来看值得考虑。）

Vue3 Electron 获取用户文档文件夹

Vue3 Electron get user docs folder

node.js

vue.js

electron