当我们执行 electron . 命令后, Electron 会运行当前目录(.)下的 package.json 文件中 main 字段指定的文件。而运行该文件的进程既是主进程。
在Electron中,进程通过开发人员定义的“通道”与ipcMain模块和ipcRenderer模块进行通信。这些通道是任意的(您可以任意命名它们)和双向的(您可以为两个模块使用相同的通道名称)。要从渲染进程向主进程发送单向IPC消息,可以再预渲染脚本preload.js里使用ipcRenderer发送API发送消息,然后在main.js里用ipcMain.on接收。你通常使用这个模式从你的web内容中调用一个主进程API。我们将通过创建一个简单的应用程序来演示这种模式,该应用程序可以通过编程方式更改窗口的标题。
我们知道开发Electron应用,难免要涉及到跨进程通信,以前Electron内置了remote模块,极大的简化了跨进程通信的开发工作,但这也带来了很多问题,具体的细节请参与我之前写的文章:
使用 JavaScript, HTML 和 CSS 构建的跨平台桌面应用,能够兼容 Mac, Windows 和 Linux 环境,我们所熟悉的 Skype, Gihub Desktop, Visual Studio Code, Atom 等等软件,都是通过 Electron 进行构建的。
目前网上有好多关于electron相关的文章,但是本人在开发的时候发现,网上大部分文章可以说是千篇一律,没有真正的痛点解析啥的很无语 ,好多的问题都需要自己去找、去试,这无异于加大了开发成本与学习成本,所以本篇博客会从electron 的api 到 electron +vue 组合式开发到 打包 及开发过程中遇见的问题分门别类的进行说明, 当然在最后的文末我会将我写的 electron + vue全家桶的git开源项目附上,需要的话就去git 吧
通过前面的学习,我们知道在Electron中,主进程和渲染进程是被换分成不同的功能的,主进程有完整的Node环境,而渲染进程默认是运行的是浏览器环境。这样划分的好处是:
要创建自定义菜单,你需要使用 Electron 的 Menu 模块。下面是个例子:
Electron作为一种基于JS语言搭建的桌面框架,其基础视图容器是包含了Chromium内核的窗口,称为BrowserWindow。对于更复杂的项目,如果需要在窗口内部嵌入第三方业务的页面,则有BrowserView、webView Tag和Iframe三种方案可供选择。
在Electron12时候被废弃,使用必须配置enableRemoteModule
昨日(2016.09.13)本文发表后,获得了一定的阅读和转发量,但经部分网友反馈和仔细审核后发现,在与 NW.js 对比的环节,言辞欠妥,且数据的真实性有待考究,特此将争议部分删除,同时借此诚挚地向 NW.js 的作者以及各位读者反馈表示感谢,期待更多深入的交流和分享,修订后的版本如下: Stack Overflow 联合创始人 Jeff Wood 曾说过,任何一个能用 JavaScript 编写的应用系统,最终都必将使用 JavaScript 实现。 简介 Electron 是一款可以通过 Web前端技
Electron中,与GUI相关的模块(如 dialog, menu 等)只存在于主进程,而不在渲染进程中
昨天给大家介绍了 ElectronEgg 这款开源桌面应用开发框架。那么我们能不能搭配使用Python语言开发一套自己的工具箱呢!
Electron 可以让你使用纯 JavaScript 调用丰富的原生(操作系统) APIs 来创造桌面应用。 你可以把它看作一个 Node. js 的变体,它专注于桌面应用而不是 Web 服务器端。
前阵子将排课系统的一些功能,提供给 solar 编辑器使用,solar 是基于互动课件编辑器 Cocos ICE 进行二次定制和个性化开发的课件制作系统,其底层是 Cocos Creator。而 Cocos Creator 是基于 Electron 进行开发的,所以学习了一些关于 Electron IPC 通信的相关知识,在这里做一个总结。 文章的开始,先让我们来了解下 Electron 是什么。 1. 什么是 Electron? Electron 官网只有一句简单的话: 使用 JavaScript,HTM
Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 在Windows上运行的跨平台应用 macOS和Linux——不需要本地开发 经验。
使用electron-vue框架,跑起来项目, 参考地址: https://simulatedgreg.gitbooks.io/electron-vue/content/cn/ 跑起来长这样
remote在旧版本是内置的模块, 但是在新版本将被弃用,要用@electron/remote进行代替
hello,好久不见,最近笔者花了几天时间入门Electron,然后做了一个非常简单的应用,本文就来给各位分享一下过程,Electron大佬请随意~
简单来说,Electron就是可以让你用Javascript、HTML、CSS来编写运行于Windows、macOS、Linux系统之上的桌面应用的库。本文的目的是通过使用Electron开发一个完整但简单的小应用:记事本,来体验一下这个神器的开发过程。本文犹如Hello World一样的存在,是个入门级笔记,但如果你之前从未接触过Electron,而又对它有兴趣,某想信这会是一篇值得一看的入门教程。 PS:这篇文章是基于Windows的开发过程,未对macOS、Linux作测试。
有句话叫做“有需求就有市场”,技术领域也同样是如此。在过往的前端领域之上,当面临需要涉及操作系统的时候,前端coder往往显得力不从心。这便是桌面应用的需求造就了 Electron 的到来。
React作为日常使用比较频繁的框架,这里就不详细说明了,这里主要是想通过几篇文章让大家快速上手Electron以及与React完美融合。
入门学习electron时了解到,渲染进程与主进程存在一对多的关系, 渲染进程与主进程需要通过ipc或remote进行通信。因为ipc的使用类似websocket, 发送和监听分离到两个独立的接口且渲染进程与主进程的接口存在不小的差异。 所以使用时存在几个比较麻烦的点: 1. 对于类似http的请求模式,接收和发送逻辑存在割裂。 2. 手动指定各个窗口发送比较繁琐。 所以打算尝试通过ipc封装一个无用的通信轮子。 简单例子 // 渲染端 const renderSocket = new Rende
窗口A的渲染进程发消息给主进程 const { clipboard, ipcRenderer, remote } = require('electron'); ipcRenderer.send('imgUploadMain', { id: dom.id, siteId: this.siteId, url: dom.src }); 主进程收到
最近一直在做批量测试工具的开发,打包的exe,程序运行也是一个黑乎乎的dos窗口。
Dear,大家好,我是“前端小鑫同学”,😇长期从事前端开发,安卓开发,热衷技术,在编程路上越走越远~ Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 在Windows上运行的跨平台应用 macOS和Linux——不需要本地开发 经验。 前情概要: 上一篇通过快速入门我们搭建了最基础的HelloWorld模型,我们接下来就要在这
https://www.slimjet.com/chrome/google-chrome-old-version.php
这些只是Electron的依赖项,跨平台最关键的自然是适配层,由供node调用的C++模块来完成平台适配,提供系统级的平台接口
本系列文章的前面几篇主要是从Electron技术本身进行了讨论(包括:第1篇初步了解Electron、第2篇进行了快速开始和技术体验、第3篇基于实际开发考虑的技术栈选型等),各位读者也应该对Electron的开发有了较为深入的了解。
vue引入electron的ipcRenderer等其它模块会出现这种情况 解决方案 自定义事件 使用渲染进程捕捉
Electron相当于一个浏览器的外壳,可以把网页程序嵌入到壳里面,可以运行在桌面上的一个程序,可以把网页打包成一个在桌面运行的程序,通俗来说就是软件,比如像QQ、优酷、网易音乐等等。功能的强大超出你的想象,可以构建跨平台桌面程序, 本身支持node.js,可以使用node.js的一些模块
如果您想要手动在亮/暗模式之间切换,您可以通过在nativeTheme模块的themeSource属性中设置所需的模式来做到这一点。此属性的值将传播到您的渲染进程。任何与prefers-color-scheme相关的CSS规则都将相应地更新。
使用Electron开发客户端程序已经有一段时间了,整体感觉还是非常不错的,其中也遇到了一些坑点,本文是从【运行原理】到【实际应用】对Electron进行一次系统性的总结。【多图,长文预警~】
没有使用electron内置的-webkit-app-region: drag 因为使用他那个有很多问题 比如事件无法使用 右键无法使用 以及不能使用手型等!
周末面试碰到一个面试题,题目是: 在MMO游戏中,服务器采用Linux操作系统,网络通信与游戏逻辑处理进程一般是分离的。 例如:GameSvr进程处理游戏逻辑,TCPSvr进程处理网络通信。Linux操作系统提供了很多机制可以实现GameSvr和TCPSvr进程之间的数据通信。请您列出两种你认为最好的机制来,并为主(最好)次(次佳)描述他们实现的框架,优缺点对比和应用中的注意事项。 答案:Linux下进程通信 一、进程间通信概述 进程通信有如下一些目的: A、数据传输:一个进程需要将它的数据发送给另一个进程
存在 Node.js C++ add-on 相关的代码时,这一层导致应用程序奔溃的可能行极大,常见原因有:
安装electron依赖经常会不成功 在项目目录下创建.npmrc文件,设置镜像地址 npm config set strict-ssl false
electron分主进程和渲染进程,渲染进程又分主窗口的渲染进程和子窗口的渲染进程
社交魔方平台是京东的 SNS 活动搭建平台,其内置了很多模板,每一个模板都有一个模板 JSON 用于生成表单,运营同学、商家配置了这个表单后就可以生成活动页面了。模板 JSON 是标准的结构化数据,包含名称、类型、控件类型、校验器、默认值等等字段。以往都是采用手写 JSON 的方式,这是非常低效的,而且容易出错。针对其结构化数据的特点可以用 GUI 的方式去编辑,我们基于 Electron[1] 参考 Github Desktop 客户端[2] 的架构编写了一个 JSON 编辑器(参见下图),通过填写表单的方式生成 JSON。所以在这里记录下这个 Electron 编辑器开发过程中可以记录的点和从 Github Desktop 客户端代码中值得学习的点。
之前本来想不写这个功能的,结果客户死活要qq登录! 实在没办法就写了,顺便写个文章! 在写之前有两个问题: 1: 打开qq授权页面点击页面中的链接会又打开一个页面! ..... 2: 授权之后是否成功很难去判断
目前Electron在github上面的star量已经快要跟React-native一样多了 这里吐槽下,webpack感觉每周都在偷偷更新,很糟心啊,还有Angular更新到了8,Vue马上又要出正
在生活中也有诸多信号,这些信号通常不是由我们发起的,而是我们接收以后对对应的信号做处理;最常见的莫过于红绿灯了,当红绿灯发出信号时(红灯,绿灯,黄灯);我们会有对应的行为,比如绿灯我们知道当前可以行走,红灯的时候我们需要等一等。对信号产生以后我们知道该做什么,这是因为我们曾经接受了对于这些信号的教育,知道当这些信号产生以后我们需要做什么。
Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入 Chromium 和 Node.js 到 二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 在Windows上运行的跨平台应用 macOS和Linux——不需要本地开发 经验。
Electron 在运行时分为主进程和渲染器进程(渲染进程),主进程可以用NodeJS的 api,渲染进程可以用浏览器的 api
公司项目有一款带即时聊天、群组功能的APP,因为要给客服人员使用,需要开发PC版本。之前使用C#开发过一个PC版本,但是C#的UI这一块支持的不太好,而且升级比较麻烦,我就牵头基于Electron去实现了一个PC版本。
之前在网上有看到很多小伙伴基于 electron 实现了非常多好用的桌面端工具,比如图床管理工具 PicGo,就专门做图床工具。也有一些其他的类似的小工具,比如 saladict-desktop 专门做沙拉翻译查词的桌面端应用,colorpicker 专做桌面端取色工具...
作者:zanewang,腾讯 CSIG 工程师 目录 (1)简介 (2)技术架构 (3)启动主进程 (4)实例化服务 (5)事件分发 (6)进程通信 (7)主要窗口 (8)开发调试 1.简介 Visual Studio Code(简称 VSCode) 是开源免费的 IDE 编辑器,原本是微软内部使用的云编辑器(Monaco)。 git 仓库地址:https://github.com/microsoft/vscode 通过 Eletron 集成了桌面应用,可以跨平台使用,开发语言主要采用微
2018年,我有幸受邀参加了HackerOne在赌城拉斯维加斯举办的,赏金超过50万美金的H1-702黑客马拉松大赛。本次大赛的测试目标包括GitHub,对我个人来说,我平时喜欢对一些常用软件开展漏洞挖掘,有了这个基础,我就把GitHub定为这次比赛中我的测试对象。最终,我发现了GitHub Desktop程序在OSX系统下的一个远程代码执行(RCE)漏洞,但却被认定为超出测试范围!好在,GitHub众测项目中有这么一句”偶尔,我们会根据具体情况酌情奖励一些例外的漏洞报告“,我也获得了GitHub官方的不菲赏金。
重装完系统后,打开Laya IDE,当我切换到场景编辑器的时候,弹出错误框让我备受煎熬。
从搭建开始 使用的是electron-vue 毕竟方便一点 如果只想安装electron 请参见我的另一个文章 https://segmentfault.com/a/11...
领取专属 10元无门槛券
手把手带您无忧上云