Electron初步【01】--主进程VS渲染进程&不一样页面间共享数据

时间 2019-11-08

标签 electron 初步进程渲染不一样页面共享数据繁體版

原文原文链接

Electron使用了网页页面做为App的GUI，所以你能够将它看作是一个由JavaScript控制的一个小型的Chrome内核浏览器。html

主进程VS渲染进程

主进程

在Electron中，跑package.json里的主脚本的进程叫做主进程。在主进程里跑的脚本能够经过建立web页面的窗口来扮演GUI角色。git

主进程看起来就是一段脚本：github

const electron = require('electron');
const app = electron.app;
const BrowserWindow = electron.BrowserWindow;

var window = null;

app.on('ready', function() {
  window = new BrowserWindow({width: 800, height: 600});
  window.loadURL('https://github.com');
});

渲染进程

正由于Electron使用了chrome内核，才使得它多进程的结构也能够被咱们使用。在Electron里的每一个页面都有它本身的进程，叫做渲染进程。web

在普通的浏览器里，网页页面跑在一个沙盒环境下，不能接触到native源码。而Electron则容许你在页面中使用Node.js的API，较低程度上的和操做系统进行交互。chrome

渲染进程如同传统的HTML，但它能够直接使用Node模块：json

<!DOCTYPE html>
<html>
  <body>
  <script>
    const remote = require('electron').remote;
    console.log(remote.app.getVersion());
  </script>
  </body>
</html>

主进程和渲染进程的不一样

主进程经过实例化BrowserWindow，每一个BrowserWindow实例都在它本身的渲染进程内返回一个web页面。当BrowserWindow实例销毁时，相应的渲染进程也会终止。api

主进程负责掌管全部的web页面和它们相应的渲染进程。每一个渲染进程都是相互独立的，它们只关心本身所运行的web页面。浏览器

在页面（渲染进程）中不容许调用原生GUI相关的API，那是由于在网页（渲染进程）中中掌管原生GUI很危险，易形成内存泄露。若是你想在网页中进行GUI的操做，渲染进程必须向主进程传达请求，而后在主进程中完成操做。app

在Electron中，咱们有几种链接主进程和渲染进程的方法，例如用于传送消息的ipcRenderer和ipcMain模块，以及用于RPC的remote模块。electron

不一样页面间共享数据

很是简单，使用HTML5 API就能完成。

Storage API，IndexedDB都是很好的选择。

你还可使用Electron中提供的IPC系统。它在主进程中将一个对象储存为全局变量，而后能够经过remote模块操做它们：

// 在主进程里
global.sharedObject = {
  someProperty: 'default value'
};

// In page 1.
require('remote').getGlobal('sharedObject').someProperty = 'new value';

// In page 2.
console.log(require('remote').getGlobal('sharedObject').someProperty);