第四章-使用本机文件对话框和帮助进程间沟通 | Electron实战 (4)

Electron只向每个进程提供其模块的一个子集,而不保留我们访问与Electron模块分离的Node的APIs。如果愿意,我们可以从渲染器进程访问数据库和文件系统,但是有一些令人信服的理由将这种功能保留在主进程中。我们可能有很多渲染器进程,但是我们总是只有一个主进程。从我们的众多的渲染器读取和写入文件系统可能会出现问题;一个或多个进程试图同时写入同一个文件,或者从一个文件中读取,而另一个渲染器进程正在重写该文件。

JavaScript中的一个给定进程在一个线程上执行我们的代码,并且一次只能做一件事。通过将这些任务委托给主进程,我们可以确信一次只有一个进程执行对给定文件或数据库的读写。其他任务遵循正常的JavaScript协议,在事件队列中耐心等待,直到主进程完成当前任务。

主进程处理调用本机操作系统APIs或提供文件系统访问的任务是有意义的,但是触发这些操作的UI在渲染器进程中调用。即使所有的代码都在同一台计算机上运行,我们仍然需要协调进程之间的通信,因为我们必须协调客户机和服务器之间的通信。

最近,出现了WebSockets和WebRTC等协议,它们允许客户机和服务器之间的双向通信,甚至客户机之间的通信,而不需要中央服务器来促进通信。当我们构建桌面应用程序时,我们通常不会使用HTTP或WebSockets,但是Electron有几种协调进程间通信的方法,我们将在本章开始探讨,如图4.11所示。

第四章-使用本机文件对话框和帮助进程间沟通 | Electron实战

图4.11 实现打开文件按钮涉及协调渲染器进程和主进程。

我们的UI包含一个带有标签Open File的按钮。当用户单击此按钮时,我们的应用程序应该提供一个对话框,允许用户选择要打开的文件。在用户选择一个文件之后,我们的应用程序应该读取文件的内容,在应用程序的左窗格中显示它们,并在右窗格中呈现相应的HTML。

正如您可能已经猜到的,这需要我们在两者之间进行协调渲染器进程(单击按钮的地方)和主进程(负责显示对话框并从文件系统中读取所选文件)。读取文件之后,主进程需要将文件的内容发送回渲染器进程(下一个清单),以便分别在左窗格和右窗格中显示和呈现。

列表4.7 在渲染器进程中添加事件监听器

const marked = require('marked'); const markdownView = document.querySelector('#markdown'); const htmlView = document.querySelector('#html'); const newFileButton = document.querySelector('#new-file'); const openFileButton = document.querySelector('#open-file'); const saveMarkdownButton = document.querySelector('#save-markdown'); const revertButton = document.querySelector('#revert'); const saveHtmlButton = document.querySelector('#save-html'); const showFileButton = document.querySelector('#show-file'); const openInDefaultButton = document.querySelector('#open-in-default'); const renderMarkdownToHtml = (markdown) => { htmlView.innerHTML = marked(markdown, { sanitize: true }); }; markdownView.addEventListener('keyup', (event) => { const currentContent = event.target.value; renderMarkdownToHtml(currentContent); }); openFileButton.addEventListener('click', () => { //选择一个更新的CSS框模型,它将正确地设置元素的宽度和高度 alert('You clicked the "Open File" button.'); });

首先将事件监听器添加到渲染器进程中的Open File按钮。有了事件监听器,就可以与主进程协调,触发前面创建的Open File对话框。

介绍remote模块

Electron提供了许多方便进程间通信的方法。第一个是remote模块-一种从渲染器进程到主进程执行进程间通信的简单方法。
remote模块(仅在呈现器进程中可用)通过镜像主进程中可访问的模块,充当主进程的代理。当我们访问任何这些属性时,远程模块还负责与主进程之间的通信。

如图4.12所示,remote模块有几个属性,这些属性与仅对主进程可用的模块重叠。在我们的渲染器进程中,我们可以引用remote模块,它提供了对主进程中的对象和属性的访问,如图4.13所示。

第四章-使用本机文件对话框和帮助进程间沟通 | Electron实战

图4.12 remote模块提供对通常仅对主进程可用的模块的访问。

第四章-使用本机文件对话框和帮助进程间沟通 | Electron实战

图4.13 remote模块提供对通常仅对主进程可用的模块的访问。

当我们调用remote对象上的方法或属性时,它向主进程发送同步消息,在主进程中执行,并将结果发送回渲染器进程。remote模块允许我们在主进程中定义功能,并且很容易使其对渲染器进程可用。

使用进程间通信触发Open File函数

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wspjgz.html