electron进程通信
模式 1:渲染器进程到主进程(单向) send和on
1.渲染器进程调用方法
@click = setTitle
2.预加载进程暴露setTile方法
setTitle: (title) => ipcRenderer.send('set-title', title),
3.主进程监听到方法
ipcMain.on('set-title',()=>{
})
模式 2:渲染器进程到主进程(双向)invoke和handle
场景:双向 IPC 的一个常见应用是从渲染器进程代码调用主进程模块并等待结果。invoke(恳求-希望得到回应)
例子:从渲染器进程打开一个原生的文件对话框,并返回所选文件的路径。
步骤:
1.渲染器进程:
<button @click="getFilePath">获取文件路径</button>
async function getFilePath(){
filePath.value =await window.api.getFilePath()
}
2.预加载暴露getFilePath方法(invoke)
getFilePath:()=>ipcRenderer.invoke('get-file-path')
3.主进程监听处理
ipcMain.handle('get-file-path',showFilePath)
async function showFilePath(){
const { canceled, filePaths } = await dialog.showOpenDialog({})
if (!canceled) {
return filePaths[0]
}else{
return false
}
}
模式 3:主进程到渲染器进程 webContents.send ipcRenderer.on
1.主进程通过webContents
发消息给渲染进程
const menu = Menu.buildFromTemplate([
{
label: app.name,
submenu: [
{
click: () => mainWindow.webContents.send('update-counter', 1),
label: 'Increment'
},
{
click: () => mainWindow.webContents.send('update-counter', -1),
label: 'Decrement'
}
]
}
])
Menu.setApplicationMenu(menu)
2.预加载进程监听到,然后暴露给渲染进程
getMainValue:(callback)=>ipcRenderer.on('update-counter',(_event,value)=>callback(value))
3.渲染进程获取
window.api.getMainValue((value)=>{
count.value+=value
})
对于从主进程到渲染器进程的 IPC,没有与 ipcRenderer.invoke
等效的 API。 不过,您可以从 ipcRenderer.on
回调中将回复发送回主进程。即模式一
模式 4:渲染器进程到渲染器进程
没有直接的方法可以使用 ipcMain
和 ipcRenderer
模块在 Electron 中的渲染器进程之间发送消息。 为此,您有两种选择:
- 将主进程作为渲染器之间的消息代理。 这需要将消息从一个渲染器发送到主进程,然后主进程将消息转发到另一个渲染器。
- Pass a MessagePort from the main process to both renderers. 这将允许在初始设置后渲染器之间直接进行通信。