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

Ajian 发布于2019-08-19 18:18 / 3774人阅读

摘要：主进程渲染进程主进程在中，跑里的主脚本的进程叫作主进程。主进程负责掌管所有的页面和它们相应的渲染进程。不同页面间共享数据非常简单，使用就能完成。

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

主进程VS渲染进程 主进程

在Electron中，跑package.json里的主脚本的进程叫作主进程。在主进程里跑的脚本可以通过创建web页面的窗口来扮演GUI角色。

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

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里的每个页面都有它自己的进程，叫作渲染进程。

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

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

主进程和渲染进程的不同

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

主进程负责掌管所有的web页面和它们相应的渲染进程。每个渲染进程都是相互独立的，它们只关心自己所运行的web页面。

在页面（渲染进程）中不允许调用原生GUI相关的API，那是因为在网页（渲染进程）中中掌管原生GUI很危险，易造成内存泄露。如果你想在网页中进行GUI的操作，渲染进程必须向主进程传达请求，然后在主进程中完成操作。

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

不同页面间共享数据

非常简单，使用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);

GPU云服务器云服务器 linux 进程间共享数据进程间共享数据 linux linux 进程间数据 linux进程间数据交换

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/79438.html

【Electron】酷家乐客户端开发实践分享 — 进程通信

摘要：为了能使不同的进程互相访问资源并进行协调工作，才有了进程间通信。此时，就需要与渲染进程通信了。发消息，渲染进程收消息内部使用来发消息。作者：钟离，酷家乐PC客户端负责人原文地址：https://webfe.kujiale.com/electron-ku-jia-le-ke-hu-duan-kai-fa-shi-jian-fen-xiang-jin-cheng-tong-xin/酷家...

winterdawn 2019-08-30 11:10 评论0 收藏0
【Electron】酷家乐客户端开发实践分享 — 进程通信

摘要：为了能使不同的进程互相访问资源并进行协调工作，才有了进程间通信。此时，就需要与渲染进程通信了。发消息，渲染进程收消息内部使用来发消息。作者：钟离，酷家乐PC客户端负责人原文地址：https://webfe.kujiale.com/electron-ku-jia-le-ke-hu-duan-kai-fa-shi-jian-fen-xiang-jin-cheng-tong-xin/酷家...

aervon 2019-08-02 15:18 评论0 收藏0
【Electron】酷家乐客户端开发实践分享 — 进程通信

摘要：为了能使不同的进程互相访问资源并进行协调工作，才有了进程间通信。此时，就需要与渲染进程通信了。发消息，渲染进程收消息内部使用来发消息。作者：钟离，酷家乐PC客户端负责人原文地址：https://webfe.kujiale.com/electron-ku-jia-le-ke-hu-duan-kai-fa-shi-jian-fen-xiang-jin-cheng-tong-xin/酷家...

Wuv1Up 2019-08-23 18:06 评论0 收藏0
XCel 项目总结 - Electron 与 Vue 的性能优化

摘要：而这里的单元格信息是唯一的，所以直接通过为一个空对象赋值即可。和相关的知识和技巧高亮的列单元格采用展示。在中，被选中的单元格会高亮相应的行和列，以提醒用户。 showImg(https://segmentfault.com/img/bVGkdk?w=900&h=500); XCEL 是一个 Excel 数据清洗工具，其通过可视化的方式让用户轻松地对 Excel 数据进行筛选。 XCEL...

XUI 2019-08-22 10:45 评论0 收藏0
一口气完成electron的入门学习

摘要：目前类似的工具有，等。在渲染进程中，直接调用原生的接口是十分危险的。这里介绍一种，通过和对象，以消息的方式进行通信。主进程获得消息后，通过返回信息。另外，还提供了一种同步的消息传递方式。打包完成功能代码后，我们需要将代码打成可运行的包。介绍目前，使用前端技术开发桌面应用已经越来越成熟，这使得前端同学也可以参与桌面应用的开发。目前类似的工具有electron，NW.js等。这里我们着...

Ethan815 2019-08-22 11:01 评论0 收藏0