Electron主进程向渲染进程发消息时丢失首个参数的问题求助

你的问题出在渲染进程回调函数的参数定义和preload脚本的参数传递逻辑不匹配，另外还有一个潜在问题是消息发送时机可能过早。

核心问题：参数错位原因 #

在preload.js中，你对ipcRenderer.on的封装是只传递event之后的参数给渲染进程：

on: (channel, func) => ipcRenderer.on(channel, (event, ...args) => func(...args))

但在renderer.js的回调里，你却定义了evt作为第一个参数，导致实际接收的参数顺序完全错位：

• 原本的'my message'被当成了evt参数
• 原本的'my second parameter'被当成了message参数
• secondParameter自然就变成undefined

解决方法（二选一） #

方法1：修改渲染进程的回调参数 #

去掉多余的evt参数，直接接收传递过来的消息参数：

// renderer.js
electron.ipcRenderer.on('asynchronous-message', function (message, secondParameter) {
    console.log(message); // 输出'my message'
    console.log(secondParameter); // 输出'my second parameter'
});

方法2：修改preload脚本传递event对象 #

如果需要在渲染进程中使用event对象（比如回复消息），可以修改preload.js，把event也传递给回调：

// preload.js
const { contextBridge, ipcRenderer } = require('electron')

contextBridge.exposeInMainWorld('electron', {
  ipcRenderer: {
    send: (channel, data) => ipcRenderer.send(channel, data),
    on: (channel, func) => ipcRenderer.on(channel, (event, ...args) => func(event, ...args))
  }
});

这样renderer.js里的原代码就可以正常工作了。

额外优化：确保消息发送时机正确 #

当前代码中，主进程在调用loadFile后立刻发送消息，此时页面可能还未加载完成，渲染进程的监听还没注册，会导致消息丢失。建议等页面加载完成后再发送：

// main.js
app.whenReady().then(() => {
    win = new BrowserWindow({
    webPreferences: {
        preload: path.join(__dirname, 'preload.js')
    }
    });
    win.loadFile("index.html");
    // 监听页面加载完成事件后发送消息
    win.webContents.on('did-finish-load', () => {
        win.webContents.send('asynchronous-message', 'my message', 'my second parameter');
    });
});

内容的提问来源于stack exchange，提问作者Graham