Electron 常见api总结

近期要给公司写一个OAIM的内部聊天桌面应用，选择了electron-vue开发，之前用过nw他爹node-webkit个人感觉一般所以弃了，于是就学习了一下electron的基本用法，毕竟vsc还有atom这些开发神器都是基于electron，这里就先简单写一些常用api，其中我自己肯定要用到的进行了标红处理

项目构建

 

由于 Electron 使用 Chromium 显示网页，那么，Chromium 的多进程架构也被使用。Electron 中的每个网页都在自己的进程中运行，称为渲染器进程 (rendererprocess)。

其中主进程文件（操作ipcMain模块的文件）需要在electron的项目主入口文件中在创建主窗口的方法中引入，渲染进程文件（操作ipcRender模块的文件）需要在html文件/模板文件引入

 

主进程，渲染进程都可用的模块

1.      shell 通过url的方式对文件进行操作

2.      screen 屏幕大小鼠标位置

3.      clipborad 剪切板文本文件

4.      crashReporter崩溃报告可以发送崩溃报告（需要外部服务支持）

5.      nativeImage所有与图片有关的模块

6.     ipcRender 渲染进程模块可以监听ipc信道中的事件以及接受ipc信道中的信息可用于与主进程（ipcMain）通信也可以和其他渲染进程通过webContents实例的send方法利用 id标志通信

7.      desktopCapturer用来捕获桌面的声音视频，类似于录屏软件

8.      remote 渲染进程想要拿到主进程的模块，例如菜单，提示框对象，只要是可枚举的就可以获取

9.      webFrame 控制如何显示与渲染网页，例如网页的缩放，安全策略

10.app 控制应用的生命周期

11.BrowserWindow 创建控制浏览器窗口

12.webContents 是BrowserWindow的一个实例属性，用于渲染和控制网页

13.ipcMain 发送与接收ipc消息的一个模块（同步通信方式有坑，不要使用，在win7环境会导致页面渲染卡死）

14.dialog 可以用来打开和保存文件以及提示框功能

15. Menu 可以创建鼠标右键菜单以及应用菜单以及通知栏小图标里面的菜单

16. MenuItem

17. net 是Electron自带的一个http请求库

18. protocol 可以注册协议，例如 file

19. session 管理浏览器会话在webContents实例下可以拿到单层页面的session

20. Tray 系统托盘可以添加通知栏区域的图标可以设置右键列表和点击事件（即win右下角那部分）

21. systemPerferences可以获取当前计算机的偏好设置

22. globalShortcut可以用来定义键盘的快捷键

23. contentTracing用来跟踪收集数据的模块可以用来查看性能瓶颈

24. powerSaveBlocker阻止系统进入睡眠模式

25. powerMonitor监听电源状态更改的模块

26. autoUpdater自动更新

在正常的浏览器中，网页通常运行在沙盒封装化的环境中，并且不允许访问本机资源。然而，Electron 用户有权在网页中使用 Node.js 的 API，从而允许较低级别的操作系统交互。

 

 

采用electron-vue构建项目

 

文档地址：https://electron.org.cn/vue/renderer-process.html

 

# 安装 vue-cli 和脚手架样板代码

npm install -g vue-cli

vue init simulatedgreg/electron-vuemy-project

 

# 安装依赖并运行你的程序

cd my-project

yarn # 或者 npm install

yarn run dev # 或者 npm run dev