如何實現electron多頁面間通信
阿新 • • 發佈:2018-11-16
log 行數 something 分享圖片 lec 分享 技術方案 com 代碼實現
如何實現electron多頁面間通信
1,業務需求:
總共有兩個頁面,頁面A顯示數據,頁面B處理數據,主線程Main
2,實現的技術方案:
在主線程中打開頁面A和B,B頁面不進行顯示,主要負責處理從A頁面發送到主線程Main上的數據,然後B將數據處理完成之後,再次將數據送到主線程Main上,主線程Main將數據再將數據轉發到頁面A上,頁面A進行數據展示。
註意:在electron中頁面A和頁面B無法進行通信。必須依托於上述解決方案。
3,多頁面消息傳遞流轉圖
4,偽代碼實現
主線程
const {ipcMain} = require(‘electron‘) ipcMain.on(‘send-message-A‘, (event, arg) => { ipcMain.on(‘send-message-B‘,(eventB,argB)=>{ eventB.sender.send(‘send-message-B-reply‘, arg) ipcMain.on("send-message-B-dealData",(ev,ar)=>{ event.sender.send(‘send-message-A-dealData‘, ar) }) }) });
頁面A
const {ipcRenderer} = require(‘electron‘) ipcRenderer.send(‘send-message-A‘, ‘someData‘) ipcRenderer.on(‘send-message-A-dealData‘, (event, arg) => { //get arg and do something console.log(arg) });
頁面B
const {ipcRenderer} = require(‘electron‘) ipcRenderer.send(‘send-message-B‘, ‘someData‘); ipcRenderer.on(‘send-message-B-reply‘, (event, arg) => {//get arg and do something //dealData ipcRenderer.send(‘send-message-B-dealData‘, arg); // event.sender.send(‘send-message-B-dealData‘, arg);//或者使用此方法 });
如何實現electron多頁面間通信