ipcMain.on(msg, () => {})：監(jiān)聽渲染進程發(fā)送的msg消息，并做出響應。
ipcMain.once(msg, () => {})：監(jiān)聽渲染進程發(fā)送的msg消息，并做出響應，但是監(jiān)聽到一次msg事件后自動移除這個監(jiān)聽器。
ipcRenderer.on(msg, () => {})：監(jiān)聽主進程發(fā)送的msg消息，并做出響應。
ipcRenderer.once(msg, () => {})：監(jiān)聽主進程發(fā)送的msg消息，并做出響應，但是監(jiān)聽到一次msg事件后自動移除這個監(jiān)聽器。
ipcRenderer.send(msg, data)：監(jiān)聽渲染進程向主進程發(fā)送msg異步消息，并攜帶參數(shù)data。
ipcRenderer.sendSync(msg, data)：監(jiān)聽渲染進程向主進程發(fā)送msg同步消息，并攜帶參數(shù)
ipcRenderer.sentTo(webContentId, msg, data)：監(jiān)聽渲染進程向具有webContentId的窗口發(fā)送消息
ipcRenderer.sendToHost(msg, data)：監(jiān)聽渲染進程向host頁面上的 <webview> 元素發(fā)送消息

ipc模塊還提供了刪除指定監(jiān)聽器和刪除所有監(jiān)聽器的方法：removeListener()、removeAllListener()，這兩個方法在ipcMain和ipcRenderer這兩個模塊中的用法是一樣的。

通過上面的幾個監(jiān)聽器我們發(fā)現(xiàn)，單獨使用ipc模塊無法實現(xiàn)主進程主動向渲染進程發(fā)送消息。所以我一般把BrowserWindow實例中的webContents和ipc模塊結(jié)合使用

一個主進程與渲染進程間通信的例子

// 在主進程中使用ipcMain
const { ipcMain, BrowserWindow } = require('electron');

window = new BrowserWindow({
?? ?width: 800,
?? ?height: 600
});

// 主進程主動向渲染進程發(fā)送消息
window.webContents.send('main webContents msg', data);

// 主進程接收渲染進程發(fā)送的消息,并通過回調(diào)函數(shù)做出響應
ipcMain.on('renderer ipc msg', (event, arg) => {
?? ?// TODO something
})

// 在渲染進程中使用ipcRender
const ipcRender = require('electron');

// 渲染進程中使用ipcRenderer.on接收主進程消息，并通過回調(diào)函數(shù)做出相應
ipcRenderer.on('main webContents msg', (event, arg) => {
?? ?// 在相應主進程事件時，通過ipcRenderer.send方法像主進程發(fā)送另一條消息
?? ?ipcRenderer.send('renderer ipc msg', data);
})

ipcRenderer發(fā)送的同步消息和異步消息

在上面列舉的幾個方法中，其中ipcRenderer發(fā)送消息的方法分為發(fā)送同步消息的方法ipcRenderer.send和發(fā)送異步消息的方法ipcRenderer.sendSync。主程序在監(jiān)聽到這兩種不同方法的消息時，可以通過不同的方式給渲染進程返回消息：

// 渲染進程

// 渲染進程發(fā)送異步消息
ipcRenderer.send('msg', data);

// 渲染進程發(fā)送同步消息。 發(fā)送同步消息，任務未完成時會阻止其他操作
var message = ipcRenderer.sendSync('sync msg', data);

ipcMain.on('msg', (event, arg) => {
?? ?// 主進程監(jiān)聽到渲染進程發(fā)的異步消息后，通過event.sender.send()的方式進行響應，可以在渲染進程中使用ipcRenderer.on監(jiān)聽'return msg'消息
?? ?event.sender.send('return msg', data)
})

ipcMain.on('sync msg', (event, arg) => {
?? ?event.retuenValue = 'msg';
})

remote模塊

在渲染進程中使用remote，可以調(diào)用主進程所提供的一些方法。（例如：dialog、menu等模塊）

const { BrowserWindow } = require('electron').remote;

//通過remote模塊，可以在渲染進程中調(diào)用BrowserWindow模塊
let win = new BrowserWindow({ width: 800, height: 600});
win.loadURL('index.html');

渲染進程中使用remote模塊返回的對象，都代表了主進程中的一個對象，一般稱為遠程對象。調(diào)用遠程對象的方法時，實際上是在想主進程發(fā)送同步消息。

比如上面的代碼中，BrowserWindow實例是通過remote模塊返回的，所以渲染進程中的BrowserWindow和win都是遠程對象。在執(zhí)行new BrowserWindow({...})這段代碼的時候，并沒有在渲染進程中創(chuàng)建BrowserWindow實例的對象，而是在主進程中創(chuàng)建了BrowserWindow對象，并把這個對象返回到渲染進程中。

remote的方法和屬性

remote.require(module)：返回主進程中的對象
remote.getCurrentWindow()：返回此網(wǎng)頁所屬的窗口
remote.getGlobal(name)：返回主進程中name的全局變量
remote.process：返回主進程中的process對象

渲染進程之間通信

上面提到的通信方法，經(jīng)過測試發(fā)現(xiàn)都無法在渲染進程之間直接通信，有時候我們開發(fā)中可以使用主進程作為中轉(zhuǎn)進行渲染進程間的通信：

// renderer process A
const { ipcRenderer } = require('electron');
ipcRenderer.send('A send msg', data);

// main process
const { ipcMain, BrowserWindow } = require('electron');

let win = new BrowserWindow({...});

ipcMain.on('A send msg', (event ,arg) => {
?? ?// TODO something
?? ?win.webContents.send('main send msg', data);
})

const { ipcRenderer } = require('electron');
ipcRenderer.on('main send msg', (event, arg) => {
    // TODO something
})

除了上面這種需要main process中轉(zhuǎn)的方式之外，還有一種方式能夠?qū)崿F(xiàn)渲染進程之間的直接通信：

// main process
// 兩個窗口互相獲取對方的窗口 id, 并發(fā)送給渲染進程
const { BrowserWindow} = require('electron');

let win1 = new BrowserWindow({...});
let win2 = new BrowserWindow({...});

win1.webContents.send('distributeIds',{
? ? win2Id : win2.id
});
win2.webContents.send('distributeIds',{
? ? win1Id : win1.id
});

// renderer process
const { remote } = require('electron').remote;

// fromId() 可以根據(jù)窗口id找到目標窗口
remote.BrowserWindow.fromId(win2Id).webContents.send('msg', data);

到此這篇關于Electron進程間通信的實現(xiàn)的文章就介紹到這了,更多相關Electron進程間通信內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: