ipcmain.js
var {ipcMain,BrowserWindow} =require(‘electron‘); var path=require(‘path‘); var win=null; //接收到广播 ipcMain.on(‘openWindow‘,function(event,aid){ //调用 BrowserWindow打开新窗口 win=new BrowserWindow({ width:400, height:300, webPreferences:{ nodeIntegration: true } }) win.loadURL(path.join(‘file:‘,__dirname,‘../news.html‘)); //开启新窗口的调试模式 win.webContents.openDevTools(); //通过win.webContents.send把当前数据广播给 news进程 win.webContents.on(‘did-finish-load‘,function(){ win.webContents.send(‘toNews‘,aid); }) win.on(‘closed‘,()=>{ win=null; }) })
new.js
//获取localStorage的数据 var {ipcRenderer} =require(‘electron‘); ipcRenderer.on(‘toNews‘,function(event,aid){ console.log(aid); })
openwidow.js
var {ipcRenderer} =require(‘electron‘); var btn=document.querySelector(‘#btn‘); //渲染进程没法直接调用主进程中的模块,但是我们可以通过 electron中的remote模块间接的调用主进程中的模块 btn.onclick=function(){ // alert(‘点击了‘); var aid=‘123456‘; ipcRenderer.send(‘openWindow‘,aid); }
new.js
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> body{ background: orange; } </style> </head> <body> news页面 <br> 哈哈哈 <script src="renderer/news.js"></script> </body> </html>
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> .content{ width: 100%; height: 400px; background: orange; overflow-y: auto; } </style> </head> <body> <button id="btn"> 打开新窗口 </button> <script src="renderer/openWindow.js"></script> </body> </html>
Electron通过 BrowserWindow 和 webContents 模块实现渲染进 程和渲染进程的通信
原文:https://www.cnblogs.com/loaderman/p/12149933.html