1:进程间通信
进程间通信使用 ipcMain与ipcRenderer模块,参考:https://www.w3cschool.cn/electronmanual/electronmanual-ipc-main.html ; https://www.w3cschool.cn/electronmanual/electronmanual-ipc-renderer.html
在主进程使用ipcMain:
const ipcMain =require('electron').ipcMain;
ipcMain.on('message',function(event, arg) {//监听渲染进程发送的message
console.log(arg);// prints "ping"
event.sender.send('reply','pong');//event.sender获取事件的发送者,并发送reply事件,‘pong’为发送的数据
});
渲染进程ipcRenderer:
const ipcRenderer =require('electron').ipcRenderer;
ipcRenderer.sendSync('message','ping')//发送同步消息,send()异步
ipcRenderer.on('reply',function(event, arg) {console.log(arg);// prints "pong"});//监听reply
在主进程也可以使用以下方式发送消息:mainWindow.webContents.send('saveMessage','delect',index,innerIndex)
webContents从主进程向渲染进程发送消息,查看更多 https://www.w3cschool.cn/electronmanual/electronmanual-web-contents.html .
以下为webContents的send()官方使用介绍
webContents.send(channel[, arg1][, arg2][, ...])
channel String
arg (可选)
通过 channel 发送异步消息给渲染进程,你也可发送任意的参数.参数应该在 JSON 内部序列化,并且此后没有函数或原形链被包括了.
渲染进程可以通过使用 ipcRenderer 监听 channel 来处理消息.
例子,从主进程向渲染进程发送消息 :
// 主进程:
var window=null;
app.on('ready',function(){
window=new BrowserWindow({width:800, height:600});
window.loadURL('file://'+ __dirname +'/index.html');
window.webContents.on('did-finish-load',function(){
window.webContents.send('ping','whoooooooh!'); //主进程发送消息ping
});
});
在渲染进程:
require('electron').ipcRenderer.on('ping', function(event, message) {//监听ping事件
console.log(message); // Prints "whoooooooh!"
});
2:使用webview控件加载页面时,webview所在页面与被加载页面间的通信
electron webview标签介绍:https://electronjs.org/docs/api/webview-tag
webview所有的方法必须在加载完成之后才能使用,如下:
webview所在页面
const webview = document.querySelector('webview')
webview.addEventListener('dom-ready', () => {
webview.openDevTools()
})
使用send()方法发送消息webview.send('start') //发送start,同上面的 wenContents的send()方法
在被webview加载的页面里
可以通过 ipcRenderer 模块去监听channel 事件,从而处理发过来的这些信息
const {ipcRenderer} = require('electron')
ipcRenderer.on('start', (ev) => {//监听start
console.log(ev)
})
$('#sendBT').click(function() {
ipcRenderer.sendToHost('ztree') //向webview所在页面发送消息
})
注意://ipcRenderer.sendToHost(channel[, arg1][, arg2][, ...]),它的事件将发往 host page 的 webview 元素,而不是主进程.
//在webview所在页面使用 webview.addEventListener('ipc-message',(event)=>{})监听被加载特免传送的消息
webview.addEventListener('ipc-message', (event) => { //ipc-message监听,被webview加载页面传来的信息
console.log(event.channel)
})
网友评论