我们如何将消息主进程发送到 Electron 中的渲染器进程

Question

我第一次玩电子。尝试创建一个文本编辑器

在渲染中，我正在发送一条消息以指示内容已更改并需要保存：

document.getElementById('content').onkeyup = e => {
  ipcRenderer.send('SAVE_NEEDED', {
    content: e.target.innerHTML,
    fileDir
  })
}

然后ipcMain接收它没有问题。在菜单上我有这个：

{
  label: 'Save',
  click: _ => {
     saveFile(message)
     // trying:
     // ipcMain.send('SAVED', 'File Saved')
     },
     accelerator: 'cmd+S', // shortcut
}

这样用户就知道文件已经有了。但这似乎不起作用。有没有其他方法可以做到这一点？我原以为“保存”将是一个预先创建的角色（有点）

Answer 1

要将消息发送回渲染器，您可以使用：

win.webContents.send('asynchronous-message', {'SAVED': 'File Saved'});

并像这样接收它：

ipcRenderer.on('asynchronous-message', function (evt, message) {
    console.log(message); // Returns: {'SAVED': 'File Saved'}
});

哪里asynchronous-message只是您将其发送到的频道。它可以是任何东西。

webContents.send 文档

Answer 2

这是我修改的内容（使用新的处理方式contextBridge），我的使用只是让 menuItem 在我的 React 代码中调用导航事件：

// preload.js

const exposedAPI = {
  // `(customData: string) => void` is just the typing here
  onMenuNav: (cb: (customData: string) => void) => {
    // Deliberately strip event as it includes `sender` (note: Not sure about that, I partly pasted it from somewhere)
    // Note: The first argument is always event, but you can have as many arguments as you like, one is enough for me.
    ipcRenderer.on('your-event', (event, customData) => cb(customData));
  }
};

contextBridge.exposeInMainWorld("electron", exposedAPI);

// typing for curious peoples
onMenuNav(cb: ((customData: string) => void)): void;

// renderer.tsx
// Call it in the renderer process, in my case it is called once at the end of renderer.tsx.

window.electron.onMenuNav(customData => {
  console.log(customData); // 'something'
});

// in main process

const customData = 'something';
mainWindow.webContents.send('your-event', customData);

Answer 3

或者 - 当您想响应从渲染器进程收到的事件时，您可以执行以下操作：

     ipcMain.on("eventFromRenderer", (event) => {
          event.sender.send("eventFromMain", someReply);
     }

来源：https : //electronjs.org/docs/api/ipc-main