电子在类和主进程之间进行大量任务通信

Posted 2023-02-16

【中文标题】电子在类和主进程之间进行大量任务通信

【英文标题】：Electron communicate between class and main process with lots of tasks

【发布时间】：2021-05-17 14:38:26

【问题描述】：

我目前正在构建一个 Electron 应用程序，我的用户可以通过它在网站上创建自动化任务。堆栈由 Electron 和 Vue 组合而成。 从 Vue 主页面，我发送一条 ipcRenderer 消息，其中包含任务所需的数据。 ipcMain 函数看起来像这样，它从下面的类中创建一个新任务并启动它。该类被添加到我可以在主进程中使用的本地数组中：

ipcMain.on('startTask', async (event, task) => 
  const newTask = new Task(task);
  tasks.push(newTask);
  newTask.start();
);

由于这些过程需要一些时间才能完成并且有多个步骤，我为每个任务创建了一个新的 javascript 类来处理过程的每个步骤，它目前看起来像这样（此时是简单的测试代码）：

import  ipcRenderer  from 'electron';
import store from '../../renderer/store';
import cloneDeep from 'lodash.clonedeep';

class Task 
  constructor(task) 
    this._task = cloneDeep(task);
  

  async updateTask(updateData) 
    store.dispatch('updateTask', updateData);
  

  async start() 
    store.dispatch('addToQueue', 
      _taskId: this._task.id
    );
    ipcRenderer.send('openCaptcha');
  


export default Task;

遗憾的是，我似乎无法在这些类中使用 ipcRenderer，它一直说即使我导入了 ipcRenderer，它也不能使用未定义的发送（我也尝试使用 require 而不是 import，但没有运气)。

我的另一个担忧是，我认为这不是处理这些任务的理想方法。我一直在寻找多个网站如何处理这些事情，但我似乎无法找到明确的答案。有人说要使用工作线程，但我不确定我是否能够在其中使用任何电子和 vuex。

总体而言，它需要能够运行大量此类任务，有时超过 100 个。

我的问题是，我怎样才能最好地处理这个问题？或者如果这种方法仍然可行，我怎样才能使 ipcRenderer 工作？

非常感谢任何帮助或提示。

【问题讨论】：

您的 webPreferences 是什么样的？我猜上下文隔离被禁用了。见this

我认为这没关系，因为任务类不在窗口中运行。主窗口确实开启了nodeIntegration，默认也开启了contextIsolation

它们是在主进程中运行，然后，还是在哪里？如果是这样，你需要使用ipcMain，而不是ipcRenderer

它们是从主进程发起的，但是ipcMain没有send方法..

您想将消息发送到哪里？到窗口中加载的页面？

【参考方案1】：

您试图在主进程中使用ipcRenderer，这是不允许的。您需要使用ipcMain。

如果你想从主进程向主进程发送消息，你应该在ipcMain上使用一个名为emit的基础方法：

ipcMain.on("openCaptcha", () => ...);
ipcMain.emit("openCaptcha");

【讨论】：

谢谢！发射功能完美无缺！

【参考方案2】：

您可以在启动前添加一个“预加载”脚本，该脚本在您的主窗口中添加ipcRenderer 对象。

mainWindow = new BrowserWindow(
    width: 1300,
    height: 750,
    minWidth: 500,
    webPreferences: 
      preload: path.join(__dirname, "preload.js"),
    
)

在你的主文件旁边创建一个预加载脚本，preload.js的内容可以是：

const  ipcRenderer  = require('electron');
window.ipcRenderer = ipcRenderer;

这会将 ipcRenderer 对象添加为 Vue 中可用的全局对象。

【讨论】：

他试图从他的主进程发送消息，而不是从渲染器。其次，暴露整个 ipcRenderer 对象会带来巨大的安全漏洞