目录
- 主进程与渲染进程
- 主进程与渲染进程之间的通信
1. 主进程与渲染进程
在 electron 中，最重要的一个概念就是主进程和渲染进程。
1.1 主进程
main.js在启动应用后就创建了一个主进程-main process，它可以通过electron中的一些模块直接与原生GUI（在你的应用窗口）交互。
1.2 渲染进程
仅启动主进程并不能给你的应用创建应用窗口。窗口是通过main文件里的主进程调用叫BrowserWindow的模块创建的。
上述示例中的index.html页面，是主进程创建了一个渲染进程窗口所加载的Web页面，每个页面都是运行在自己的进程里，这些进程我们称之为渲染进程。
渲染进程会在窗口中渲染出web页面（引用了CSS，JavaScript，图片等的HTML文件）。web页面是Chromium渲染的，因为各系统下标准是统一的的，所以兼容性很好。
1.3 主进程与渲染进程的关系
主进程通过构造BrowserWindow实例来创建页面。每个 BrowserWindow实例都在自己的渲染进程里运行页面。当一个 BrowserWindow 实例被销毁后，相应的渲染进程也会被终止。
主进程管理所有页面和与之对应的渲染进程。每个渲染进程都是相互隔离的，并且只知道运行在该进程里的页面。
在页面里调用本地GUI是不允许的，因为在Web页面里管理本地GUI资源是非常危险而且容易造成资源泄露。如果你想在网页里进行GUI操作，该页面的渲染进程必须与主进程进行通讯，请求主进程进行相关的 GUI 操作。
2. 主进程与渲染进程之间的通信
在electron中，主进程与渲染进程有很多通信的方法。比如ipcRenderer和ipcMain，还可以在渲染进程使用remote模块。
2.1 ipcMain & ipcRenderer
- 主进程：ipcMain
- 渲染进程：ipcRenderer
ipcMain模块和ipcRenderer是类EventEmitter的实例。
在主进程中使用ipcMain接收渲染线程发送过来的异步或同步消息，发送过来的消息将触发事件。
在渲染进程中使用ipcRenderer向主进程发送同步或异步消息，也可以接收到主进程的消息。
- 发送消息，事件名为 channel .
- 回应同步消息, 你可以设置 event.returnValue .
- 回应异步消息, 你可以使用 event.sender.send(...)
下面给出一个简单例子：
// In main process.
const ipcMain = require('electron').ipcMain;
ipcMain.on('asynchronous-message', function(event, arg) {
console.log(arg); // prints "ping"
event.sender.send('asynchronous-reply', 'pong');
});
ipcMain.on('synchronous-message', function(event, arg) {
console.log(arg); // prints "ping"
event.returnValue = 'pong';
});
// In renderer process (web page).
const ipcRenderer = require('electron').ipcRenderer;
console.log(ipcRenderer.sendSync('synchronous-message', 'ping')); // prints "pong"
ipcRenderer.on('asynchronous-reply', function(event, arg) {
console.log(arg); // prints "pong"
});
ipcRenderer.send('asynchronous-message', 'ping');
同样也可以从主进程向渲染进程发送消息，使用的是 webContents.send方法，下面是具体的例子：
// 主进程.main.js
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!');
});
});
<!-- index.html -->
<html>
<body>
<script>
require('electron').ipcRenderer.on('ping', function(event, message) {
console.log(message); // Prints "whoooooooh!"
});
</script>
</body>
</html>
2.2 remote模块
remote模块支持RPC风格的通信，在渲染进程中获取主进程创建的一些全局对象和应用信息，还可以调用主进程所提供的一些方法，如重启应用、操作渲染进程等。
remote 模块提供了一种在渲染进程（ 网页） 和主进程之间进行进程间通讯（ IPC） 的简便途径。使用remote 模块，可以调用主进程对象的方法，而无需显式地发送进程间消息，这类似于 Java
的 RMI。
下面是从渲染进程创建一个浏览器窗口的例子：
const remote = require('electron').remote;
const BrowserWindow = remote.BrowserWindow;
var win = new BrowserWindow({ width: 800, height: 600 });
win.loadURL('https://github.com');
注意: 反向操作（ 从主进程访问渲染进程） ，可以使用webContents.executeJavascript.
远程对象
remote 模块返回的每个对象（ 包括函数） 都代表了主进程中的一个对象（我们称之为远程对象或者远程函数）。当调用远程对象的方法、执行远程函数或者使用远程构造器（ 函数） 创建新对象时，其实就是在发送同步的进程间消息。
在上面的例子中， BrowserWindow 和 win 都是远程对象，然而 new BrowserWindow 并没有在渲染进程中创建 BrowserWindow 对象。 而是在主进程中创建了BrowserWindow 对象，并在渲染进程中返回了对应的远程对象，即 win 对象。
请注意只有可枚举属性才能通过 remote 进行访问.
远程对象的生命周期
Electron 确保在渲染进程中的远程对象存在（换句话说，没有被垃圾收集），那主进程中的对应对象也不会被释放。当远程对象被垃圾收集之后，主进程中的对应对象才会被取消关联。如果远程对象在渲染进程泄露了（即，存在某个表中但永远不会释放），那么主进程中的对应对象也一样会泄露，所以你必须小心不要泄露了远程对象。
不过，主要的值类型如字符串和数字，是传递的副本。
给主进程传递回调函数
在主进程中的代码可以从渲染进程——remote模块——中接受回调函数，但是使用这个功能的时候必须非常非常小心。
首先，为了避免死锁，传递给主进程的回调函数会进行异步调用。所以不能期望主进程来获得传递过去的回调函数的返回值。
比如，你不能主进程中给 Array.map 传递来自渲染进程的函数。
// 主进程 mapNumbers.js
exports.withRendererCallback = function(mapper) {
return [1,2,3].map(mapper);
}
exports.withLocalCallback = function() {
return exports.mapNumbers(function(x) {
return x + 1;
});
}
// 渲染进程
var mapNumbers = require("remote").require("./mapNumbers");
var withRendererCb = mapNumbers.withRendererCallback(function(x) {
return x + 1;
})
var withLocalCb = mapNumbers.withLocalCallback()
console.log(withRendererCb, withLocalCb) // [true, true, true], [2, 3, 4]
如你所见，渲染器回调函数的同步返回值没有按预期产生，与主进程中的一模一样的回调函
数的返回值不同。
其次，传递给主进程的函数会持续到主进程对他们进行垃圾回收。
例如，下面的代码第一眼看上去毫无问题。给远程对象的 close 事件绑定了一个回调函数：
remote.getCurrentWindow().on('close', function() {
// blabla...
});
但记住主进程会一直保持对这个回调函数的引用，除非明确的卸载它。如果不卸载，每次重新载入窗口都会再次绑定，这样每次重启就会泄露一个回调函数。
更严重的是，由于前面安装了回调函数的上下文已经被释放，所以当主进程的 close 事件触
发的时候，会抛出异常。
为了避免这个问题，要确保对传递给主进程的渲染器的回调函数进行清理。可以清理事件处
理器，或者明确告诉主进行取消来自已经退出的渲染器进程中的回调函数。
访问主进程中的内置模块
在主进程中的内置模块已经被添加为 remote 模块中的属性，所以可以直接像使
用 electron 模块一样直接使用它们。
const app = remote.app;
方法
remote 模块有以下方法：
- remote.require(module)
module String
返回在主进程中执行 require(module) 所返回的对象。 - remote.getCurrentWindow()
返回该网页所属的 BrowserWindow 对象。 - remote.getCurrentWebContents()
返回该网页的 WebContents 对象 - remote.getGlobal(name)
name String
返回在主进程中名为 name 的全局变量(即 global[name] ) 。 - remote.process
返回主进程中的 process 对象。等同于 remote.getGlobal('process') 但是有缓存
网友评论