在之前的文章我们介绍了一下Electron的菜单创建和事件绑定，其中提到了一个remote模块，接下来我们继续说一下Electron的这个remote模块。

官方关于remote模块的地址：https://www.electronjs.org/docs/api/remote

remote 模块为渲染进程（web页面）和主进程通信（IPC）提供了一种简单方法。

在Electron中, GUI 相关的模块 (如  dialog、menu 等) 仅在主进程中可用, 在渲染进程中不可用。 为了在渲染进程中使用它们, ipc 模块是向主进程发送进程间消息所必需的。 使用 remote 模块, 你可以调用 main 进程对象的方法, 而不必显式发送进程间消息, 类似于 Java 的 RMI。
例如：从渲染进程创建浏览器窗口。

上面是官方对remote的基本介绍，之前我们说过package.json中的main乳肉就是Electron的主进程，渲染的index.html页面相当于一个渲染进程，如果我们想要在idnex.html中打开一个页面，如果还用index.js中的方法的话就相当于又开了一个进程，这显然是不可取的，所以Electron就为我们提供了remote模块来解决此问题。

根据上面的解释，我们就来做一个这样的页面中打开另一个页面的功能，先看一下上一章说完之后的目录结构：

我们先在index.html中第一一个button按钮，点击该按钮来行使打开另一个页面的方法：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>hello world</title>

 </head>

 <body>

 <div>

     <button id="btn">点我打开其他页面</button>

     <script>

         let btn = document.getElementById('btn');

         /* 之前在 index.js 中引入 BrowserWindow 的方式 */

         // const {BrowserWindow} = require('electron');

         /* 通过remote模块引入 BrowserWindow 的方式 */

         let {BrowserWindow} = require('electron').remote;

         window.onload = function () {

             btn.onclick = () => {

                 let win = new BrowserWindow({

                     width: 500,

                     height: 500,

                     x: 500, // 相对于电脑桌面向右位移500px

                     y: 500, // 相对于电脑桌面向下位移500px

                 });

                 win.loadFile('other.html')

             }

         }

     </script>

 </div>

 </body>

 </html>

在上面的代码中，我们定义了一个button按钮，并在下面写了一段JS代码，当点击该按钮时，触发一个Electron的打开窗口的方法，和之前写的略有不同的是我们在引入 BrowserWindow 方法时是从electron的一个 remote 模块中添加的，我们在同级目录下创建一个 other.html 的文件，运行起来看一下运行效果：

上面的效果符合我们的预期，如果我们不实用remote模块而直接调用BrowserWindow方法会出现什么结果呢？即把上面的第 14 行注释解开，将第 17 行注释掉，运行一下：

通过控制台可以看出报错了，并没有达到我们打开另一个窗口的预期。

注意: 反过来（如果需要从主进程访问渲染进程），可以使用 webContents. executeJavascript。

注意事项： 因为安全原因，remote 模块能在以下几种情况下被禁用：

  • BrowserWindow - 通过设置 enableRemoteModule 选项为 false。
  • <webview> - 通过把  enableremotemodule属性设置成 false。

remote模块也能反问主进程中的内置模块，主过程中的内置模块被添加为 remote 模块中的获取器，因此可以像 electron 模块一样直接使用它们。

 const app = require('electron').remote.app

 console.log(app)

以上是关于 remote 的简单介绍，在日常开发中我们还会经常使用该模块及它的另一些方法，

从零开始学Electron笔记（三）的更多相关文章

  1. 从零开始学Electron笔记（四）

    在之前的文章我们介绍了一下Electron的这个remote模块,接下来我们继续说一下Electron的右键菜单的制作. 在我们日常我们使用的软件中都会存在右键菜单的情况,比如我们用到的浏览器,开发所 ...

  2. 从零开始学Electron笔记（一）

    前端技术在最近几年迅猛发展,在任何开发领域我们都能看到前端的身影,从PC端到手机端,从APP到小程序,似乎前端已经无所不能,这就要求我们需要不断地去学习来提升自己!前段时间尤大通过直播介绍了一下Vue ...

  3. 从零开始学Electron笔记（六）

    在之前的文章我们介绍了一下Electron如何通过链接打开浏览器和嵌入网页,接下来我们继续说一下Electron中的对话框 Dialog和消息通知 Notification. 在之前的文章中其实我们是 ...

  4. 从零开始学Electron笔记（二）

    在之前的文章我们简单介绍了一下Electron可以用WEB语言开发桌面级应用,接下来我们继续说一下Electron的菜单创建和事件绑定. 我们接上一章的代码继续编写,上一章代码 https://www ...

  5. 从零开始学Electron笔记（五）

    在之前的文章我们介绍了一下Electron的右键菜单的制作,接下来我们继续说一下Electron如何通过链接打开浏览器和嵌入网页. 现在有这样一个需求,我们要在我们的软件中加一个链接,然后点击该链接打 ...

  6. 从零开始学Electron笔记（七）

    在之前的文章我们介绍了一下Electron中的对话框 Dialog和消息通知 Notification,接下来我们继续说一下Electron中的系统快捷键及应用打包. 全局快捷键模块就是 global ...

  7. 从零开始学Xamarin.Forms(三) Android 制作启动画面

    原文:从零开始学Xamarin.Forms(三) Android 制作启动画面     Xamarin.Forms 在启动的时候相当慢,必须添加一个启动界面,步骤如下: 1.将启动画面的图片命名为:s ...

  8. 从零开始学架构（三）UML建模

    文章大纲 1.  文章介绍 2.  UML概述 3.  静态模型 4.  动态模型 5.  UML建模的一般过程 一.文章介绍 1.1为什么学习UML (1)UML是一种软件架构的模型表现方法,用于项 ...

  9. Mysql 5.5从零开始学阅读笔记

    第一章 1.什么是数据库? 数据库包含两层含义:保管数据的“仓库”,以及数据管理的方法和技术. 2.表 行被称为记录,列被称为字段 3.主键 primary key,用于唯一标识表中的每一条记录,主键 ...

随机推荐

  1. 数据结构与算法-python描述-单链表

    # coding:utf-8 # 单链表的相关操作: # is_empty() 链表是否为空 # length() 链表长度 # travel() 遍历整个链表 # add(item) 链表头部添加元 ...

  2. 移动UI系列 - 简单地使用半衰期算法来预测手势的滑动方向与速度

    前言 有一个问题, 给定一个物体的运动轨迹, 包含时间和坐标的数组, 如何使用这个数据来预测物体未来的运动走势?? 本文提供了一个很简单的方式去实现这个算法. 效果够用, 又简单, 有一定的准确程度. ...

  3. 自动网络搜索（NAS）在语义分割上的应用（一）

    [摘要]本文简单介绍了NAS的发展现况和在语义分割中的应用,并且详细解读了两篇流行的work:DARTS和Auto-DeepLab. 自动网络搜索 多数神经网络结构都是基于一些成熟的backbone, ...

  4. 使用PD（Power Designer）设计数据库，并且生成可执行的SQL文件创建数据库（本文以SQL Server Management Studio软件执行为例）

    下载和安装PD: 分享我的软件资源,里面包含了对PD汉化包(链接出问题时可以留言,汉化包只能对软件里面部分菜单栏汉化) 链接:https://pan.baidu.com/s/1lNt1UGZhtDV8 ...

  5. java8 Date相关工具

    自己整理的java8 常用的工具类 /** * @Author taozhaoyang * @Description 结合 java8 线程安全 * @Date 9:55 2018/7/30 **/ ...

  6. Javascript 随机显示数组元素

    $(function(){ var wx_arr = ['gb3055','gb6365']; var storage = window.localStorage; function random_w ...

  7. laravel表单中文错误提示本地化

    <?php return [ /* |-------------------------------------------------------------------------- | V ...

  8. iOS开发实践-OOM治理

    概览 说起iOS的OOM问题大家第一想到的应该更多的是内存泄漏(Memory Leak),因为无论是从早期的MRC还是2011年Apple推出的ARC内存泄漏问题一直是iOS开发者比较重视的问题,比如 ...

  9. php 判断设备是手机还是平板还是pc

    1 <?php 2 //获取USER AGENT 3 $agent = strtolower($_SERVER['HTTP_USER_AGENT']); 4 5 //分析数据 6 $is_pc ...

  10. 国外一教授坦言，用这方法能迅速成为python程序员，但都不愿意说_编程小十

    越来越多的人学习python,但你学习python用了多长的时间?#Python# 你知道如何才能迅速掌握并成为python程序员吗?   有这样的一位国外的教授说,要迅速成为python程序员,几乎 ...