我将尝试用简短的段落描述一个最小化的问题.
总之,我想用一些逻辑,或是从网页调用一些功能在我的电子应用在我的电子应用(我在实际包装为我的网页电子应用"壳").
假设我想在我的Electron应用程序中公开一个函数.说,
function printNumbers () { console.log(1) }
请注意它应该位于我的电子代码中.
然后在运行我的应用程序后,我想从我的网页上调用此功能(单击我的网页中的一个按钮,该按钮从网站加载,然后在我的Electron App中打开一个新窗口).现在,我想我可以使用开发者控制台检查printNumber是否有效.
我已经检查了如何使用remote
模块来调用电子内部的函数/模块.但我没有找到一种方法来调用我在电子代码库中编写的函数.
顺便说一句:我可以启用该nodeIntegration
选项.
渲染器进程和主进程之间有两种主要的通信方式.
1.一种方法是使用远程模块来要求您从主进程获取的代码.此对象将包含从主进程代码导出的任何内容.
// main process, for example app/main.js exports.test = () => console.log('Yay'); // renderer process, for example app/renderer.js const { remote } = require('electron'); const mainProcess = remote.require('./main.js'); mainProcess.test(); // 'Yay'
2.另一种方法是使用进程间通信在主进程和渲染器进程之间发送/接收事件:
// main process, for example app/main.js myWindow.webContents.send('my-cool-log-event', 'Yay'); // renderer process, for example app/renderer.js const { ipcRenderer } = require('electron'); ipcRenderer.on('my-cool-log-event', (evt, msg) => console.log(msg)); // 'Yay'
如果要在渲染器进程中触发单击事件时从主进程调用函数,则可以使用任一方法.
1.
// main process, for example app/main.js exports.onClick = () => console.log('Yay'); // renderer process, for example app/renderer.js const { remote } = require('electron'); const mainProcess = remote.require('./main.js'); document .querySelector('#elem') .addEventListener('click', () => { mainProcess.onClick(); });
2.
// main process, for example app/main.js const { ipcMain } = require('electron') ipcMain.on('click', () => console.log('do something')); // renderer process, for example app/renderer.js const { ipcRenderer } = require('electron'); document .querySelector('#elem') .addEventListener('click', () => { ipcRenderer.send('click'); });