在之前的文章我们介绍了一下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. 为什么阿里巴巴Java开发手册中不允许魔法值出现在代码中？

    在阅读<阿里巴巴Java开发手册>时,发现有一条关于关于常量定义的规约,具体内容如下: 图中的反例是将数据缓存起来,并使用魔法值加链路 id 组成 key,这就可能会出现其他开发人员在复制 ...

  2. Koa源码解析，带你实现一个迷你版的Koa

    前言 本文是我在阅读 Koa 源码后,并实现迷你版 Koa 的过程.如果你使用过 Koa 但不知道内部的原理,我想这篇文章应该能够帮助到你,实现一个迷你版的 Koa 不会很难. 本文会循序渐进的解析内 ...

  3. 如何在本地搭建微信小程序服务器

    现在开发需要购买服务器,价格还是有点贵的,可以花费小代价就可以搭建一个服务器,可以用来开发小程序,博客等. 1.域名(备案过的) 2.阿里云注册免费的https证书 3.配置本地的nginx 4.内网 ...

  4. 【shell】十分钟轻松入门；如果没入门，您吐口口水再走吧！

    一.什么是shell? Shell是什么? 1.Shell 是一个程序,Linux默认是用bash. Shell 是一个用 C 语言编写的程序,既是一种命令语言,又是一种程序设计语言,是用户使用Lin ...

  5. 存储系列之 DAS、SAN、NAS三种常见架构概述

    随着主机.磁盘.网络等技术的发展,对于承载大量数据存储的服务器来说,服务器内置存储空间,或者说内置磁盘往往不足以满足存储需要.因此,在内置存储之外,服务器需要采用外置存储的方式扩展存储空间,今天在这里 ...

  6. Source Insight 中的 Auto Indenting

    编码过程中,希望输入花括号时能自动对齐,Source Insigth 应如何设置? 先来看一下Source Insight 中的帮助. “ Auto Indenting The auto-indent ...

  7. mitmdump+python的使用（代码篇）

    mitmproxy+python代码篇 一.上个推文我们介绍了mitmdump的简单操作,下面我们开始学习,mitmdump配合python脚本的使用.第一点先讲日志输出.请看图片 先导入ctx模块: ...

  8. JavaSE基础之数组

    数组 一.静态初始化 格式一 数据类型[] 变量名 = {元素1,元素2,元素3...}; 格式二 数据类型[] 变量名 = new 数据类型{元素1,元素2,元素3...}; 或者: 数据类型[] ...

  9. WeChair项目Alpha冲刺(5/10)

    团队项目进行情况 1.昨日进展    Alpha冲刺第五天 昨日进展: 前端:完成小程序登录态的定义 后端:成功部署项目到服务器并能通过域名访问项目 数据库:调整属性数据类型 2.今日安排 前端:完善 ...

  10. Mysql使用xtrabackup备份失败处理

    在生产环境中使用的是xtrabackup,对mysql进行备份,每天0点开始备份,周日是全量备份,其他时间是基于周日做的增量备份,通过脚本实现,每天备份完成后会发送短信,突然有一天,备份全部失败,手动 ...