使用 Electron 在两个进程 (主进程和渲染进程) 之间进行通讯

novo 发布于2019-08-21 16:58 / 3260人阅读

摘要：使用在两个进程主进程和渲染进程之间进行通讯此系列文章的应用示例已发布于可以或下载后运行查看欢迎通过进程间通信模块允许您在主进程和渲染进程之间发送和接收同步和异步消息这个模块有一个版本可用于这两个进程和在浏览器中查看和的完整文档异步消息

使用 Electron 在两个进程 (主进程和渲染进程) 之间进行通讯

此系列文章的应用示例已发布于 GitHub: electron-api-demos-Zh_CN. 可以 Clone 或下载后运行查看. 欢迎 Star .

通过 ipc（进程间通信）模块允许您在主进程和渲染进程之间发送和接收同步和异步消息.

这个模块有一个版本可用于这两个进程: ipcMain 和 ipcRenderer.

在浏览器中查看 main process 和 renderer proces 的完整 API 文档.

异步消息

支持: Win, macOS, Linux | 进程: Both

使用 ipc 以异步方式在进程之间发送消息是首选方法, 因为它会在完成时返回, 而不会阻止同一进程中的其他操作.

此示例将从此进程（渲染器）发送异步消息 "Ping" 到主进程, 然后主进程回答 "Pong".

渲染器进程

const ipc = require("electron").ipcRenderer

const asyncMsgBtn = document.getElementById("async-msg")

asyncMsgBtn.addEventListener("click", function () {
  ipc.send("asynchronous-message", "ping")
})

ipc.on("asynchronous-reply", function (event, arg) {
  const message = `异步消息回复: ${arg}`
  document.getElementById("async-reply").innerHTML = message
})

主进程

const ipc = require("electron").ipcMain

ipc.on("asynchronous-message", function (event, arg) {
  event.sender.send("asynchronous-reply", "pong")
})

同步消息

支持: Win, macOS, Linux | 进程: Both

您可以使用 ipc 模块在进程之间发送同步消息. 但请注意, 此方法的同步特性意味着它在完成任务时会阻止其他操作.

此示例将从此进程（渲染器）发送同步消息 "Ping" 到主进程, 然后主进程回答 "Pong".

渲染器进程

const ipc = require("electron").ipcRenderer

const syncMsgBtn = document.getElementById("sync-msg")

syncMsgBtn.addEventListener("click", function () {
  const reply = ipc.sendSync("synchronous-message", "ping")
  const message = `同步消息回复: ${reply}`
  document.getElementById("sync-reply").innerHTML = message
})

主进程

const ipc = require("electron").ipcMain

ipc.on("synchronous-message", function (event, arg) {
  event.returnValue = "pong"
})

与隐藏窗口通信

支持: Win, macOS, Linux | 进程: Both

通常的做法是创建一个新的不可见浏览器窗口（渲染器进程）, 以便在不影响主应用程序窗口中的性能的情况下运行任务.

在这个示例中, 我们使用 remote 模块从这个渲染器进程创建一个新的不可见的浏览器窗口. 当新页面加载时, 我们用 ipc 发送一个消息给正在监听的新窗口.

然后新窗口计算阶乘并发送要由此接收的结果到原始窗口并添加到上面的页面中.

渲染器进程

const BrowserWindow = require("electron").remote.BrowserWindow
const ipcRenderer = require("electron").ipcRenderer
const path = require("path")

const invisMsgBtn = document.getElementById("invis-msg")
const invisReply = document.getElementById("invis-reply")

invisMsgBtn.addEventListener("click", function (clickEvent) {
  const windowID = BrowserWindow.getFocusedWindow().id
  const invisPath = "file://" + path.join(__dirname, "../../sections/communication/invisible.html")
  let win = new BrowserWindow({ width: 400, height: 400, show: false })
  win.loadURL(invisPath)

  win.webContents.on("did-finish-load", function () {
    const input = 100
    win.webContents.send("compute-factorial", input, windowID)
  })
})

ipcRenderer.on("factorial-computed", function (event, input, output) {
  const message = `${input} 的阶乘是 ${output}`
  invisReply.textContent = message
})

隐藏窗口页面的HTML

如果这边文章对您有帮助, 感谢下方点赞或 Star GitHub: electron-api-demos-Zh_CN 支持, 谢谢.

云服务器 GPU云服务器进程间通讯动态库进程间通讯linux 服务器进程一直在增加失败的进程是进程?2604

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

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

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入门介绍

摘要：进程主进程在里，运行里脚本的进程被称为主进程。渲染进程由于使用来展示页面，所以的多进程结构也被充分利用。当一个实例被销毁后，相应的渲染进程也会被终止。在，我们提供用于在主进程与渲染进程之间通讯的模块。 Github 系列文章地址笔者前两天心血来潮做了个MACOS下可以进行OCR图文识别的小工具，发现Electron 在1.x之后API发生了挺大的变化，估计也是我好久没碰了，所以打算把这...

yunhao 2019-08-21 10:53 评论0 收藏0
Electron 快速入门

摘要：当一个实例被销毁后，相应的渲染进程也会被终止。之所以命名为，主要是为了与主进程这个概念对应。部分在事件触发后才能使用。当全部窗口关闭时退出。主进程接收到消息并处理之后，会返回处理结果。简介 Electron 是一个可以使用 Web 技术如 JavaScript、HTML 和 CSS 来创建跨平台原生桌面应用的框架。借助 Electron，我们可以使用纯 JavaScript 来调用丰...

Drummor 2019-08-20 17:49 评论0 收藏0
Electron 实战桌面计算器应用

摘要：在菜单中，我想点击子菜单打开一个网站，那么就可以用到方法，则会在默认浏览器中打开打包应用其实将程序打包成桌面应用才是比较麻烦的事。前言 Electron 是一个搭建跨平台桌面应用的框架，仅仅使用 JavaScript、HTML 以及 CSS，即可快速而容易地搭建一个原生应用。这对于想要涉及其他领域的开发者来说是一个非常大的福利。项目介绍仓库地址：lin-xin/calculato...

GeekQiaQia 2019-08-20 19:09 评论0 收藏0
实现electron-bridge

electron-bridge github链接求star Motivition 如果想一套代码同时能跑在web环境和electron环境中，就需要在代码中先判断环境，再分别写对应的逻辑。每次写到electron环境下的逻辑，又要区分渲染进程和主进程，因为有些事只能渲染进程做，有些事只能主进程做。所以，我希望能将这些抽象出来，某个方法，只能在electron环境下被调用，并且不需要关心在什么进...

Hujiawei 2019-08-20 16:52 评论0 收藏0