Element 学习（2）：主进程API（app）

前言

该学习项目基于 Element 学习（1）：搭建项目 中搭建的vue项目，后续不再备注

electron官方API： 传送门

只学习window平台下的用法，苹果和Linux自行查看文档

事件

const { app } = require('electron')
app.on('window-all-closed', () => {
  app.quit()
})

所有事件都是通过on 进行监听，下面整理一下常用的事件，一下内容都是基于官方文档

事件: 'will-finish-launching’

当应用程序完成基础的启动的时候被触发。 在 Windows 和 Linux 中, will-finish-launching 事件与 ready 事件是相同的; 在 macOS 中，这个事件相当于 NSApplication 中的 applicationWillFinishLaunching 提示。 通常会在这里为 open-file 和 open-url 设置监听器，并启动崩溃报告和自动更新。

绝大部分情况下，你必须在ready事件句柄中处理所有事务

事件: 'ready’
当 Electron 完成初始化时，发出一次。上面那个说了，在这里可以设置监听器，并启动崩溃报告和自动更新

在backaground.js 里可以看到下面的代码，这里有一个下载异常和日志和创建应用窗口

app.on('ready', async () => {
  if (isDevelopment && !process.env.IS_TEST) {
    // Install Vue Devtools
    try {
      await installExtension(VUEJS3_DEVTOOLS)
    } catch (e) {
      console.error('Vue Devtools failed to install:', e.toString())
    }
  }
  createWindow()
})

事件: 'window-all-closed’

当所有的窗口都被关闭时触发。
如果你没有监听此事件并且所有窗口都关闭了，默认的行为是控制退出程序；但如果你监听了此事件，你可以控制是否退出程序。 如果用户按下了 Cmd + Q，或者开发者调用了 app.quit()，Electron 会首先关闭所有的窗口然后触发 will-quit 事件，在这种情况下 window-all-closed 事件不会被触发。

事件：'before-quit’

返回:event Event
在程序关闭窗口前发信号。 调用 event.preventDefault() 将阻止终止应用程序的默认行为。

注意： 如果由 autoUpdater.quitAndInstal() 退出应用程序 ，那么在所有窗口触发 close 之后 才会触发 before-quit 并关闭所有窗口。

注:在 Windows 系统中，如果应用程序因系统关机/重启或用户注销而关闭，那么这个事件不会被触发。

事件: 'browser-window-blur’​

返回:

• event Event
• window BrowserWindow
  在 browserWindow 失去焦点时发出。

事件: 'browser-window-focus’

返回:

• event Event
• window BrowserWindow
  在 browserWindow 获得焦点时发出。

backaground.js

app.on('browser-window-focus',(event)=>{
  console.log("浏览器获得了焦点")
  console.log("事件：",event)
})

主进程的输出，不会在控制台里打印，会在你的编辑器（你启动项目的地方）输出

事件: 'browser-window-created’
返回事件对象，在创建浏览器窗口时触发

事件: 'web-contents-created’
返回事件对象，在创建新的web页面内容时触发

事件: 'certificate-error’
证书验证失败时触发，具体看文档

事件: 'select-client-certificate’
当一个证书被请求时触发，具体看文档

事件: 'render-process-gone’
渲染器进程意外消失时触发。 这种情况通常因为进程崩溃或被杀死。这个挺有用的，具体看官方文档

事件: 'child-process-gone’
子进程意外消失时触发。 这种情况通常因为进程崩溃或被杀死。 子进程不包括渲染器进程。

方法

app.quit()
尝试关闭所有窗口 将首先发出 before-quit 事件。 如果所有窗口都已成功关闭, 则将发出 will-quit 事件, 并且默认情况下应用程序将终止。
此方法会确保执行所有beforeunload 和 unload事件处理程序。 可以在退出窗口之前的beforeunload事件处理程序中返回false取消退出。

app.exit([exitCode])
使用exitCode立即退出，默认为0.所有窗口都将理解被关闭，而不询问用户，而且 before-quit 和 will-quit 事件也不会被触发。

app.relaunch([options])
从当前实例退出，重启应用。
默认情况下，新的实例将会使用和当前实例相同的工作目录以及命令行参数。 当设置了 args 参数时， args 将作为命令行参数传递。 当设置了 execPath ，execPath 将被执行以重新启动，而不是当前的应用程序。
请注意, 此方法在执行时不会退出当前的应用程序, 你需要在调用 app.relaunch 方法后再执行 app. quit 或者 app.exit 来让应用重启。
当 app.relaunch 被多次调用时,多个实例将在当前实例退出后启动。
立即重启当前实例并向新的实例添加新的命令行参数的示例：

const { app } = require('electron')

app.relaunch({ args: process.argv.slice(1).concat(['--relaunch']) })
app.exit(0)

app.isReady()
返回 Boolean 类型 - 如果 Electron 已经完成初始化，则返回 true, 其他情况为 false

app.focus([options])
在 Linux 上，使第一个可见窗口获得焦点。 在 macOS上，将应用程序变成激活的app。 在 Windows上，使应用程序的第一个窗口获得焦点。

app.setAppLogsPath([path])

• path String (可选) - 日志存放的自定义路径。 必须是绝对路径。

设置或创建一个您的应用程序日志目录，然后可以通过 app.getPath() 或 app.setPath(pathName, newPath) 进行操作。
调用 app.setAppLogsPath() 却没有指定 path 参数将导致此目录在 macOS 下被设置为 ~/Library/Logs/YourAppName；在 Linux 和Windows 下将被设置到 userData 目录中。

app.getAppPath()
返回当前应用程序所在目录

app.getPath(name)
根据name请求路径，name是具体的值，比如：home 用户的 home 文件夹（主目录）。具体查看文档

app.getFileIcon(path[, options])
读取文件的关联图标。返回值是一个promise对象，输出了一下，目前不知道有啥用

background.js

app.on('ready', async () => {
  if (isDevelopment && !process.env.IS_TEST) {
    // Install Vue Devtools
    try {
      await installExtension(VUEJS3_DEVTOOLS)
    } catch (e) {
      console.error('Vue Devtools failed to install:', e.toString())
    }
  }
  createWindow()
  
 let fileIcon= app.getFileIcon('../src/assets/logo.png')
  fileIcon.then(data=>{
    console.log(data)
  })
})

app.setPath(name, path)

重写 name 的路径为 path，一个特定的文件夹或者文件。 如果路径指向一个不存在的目录，则抛出一个 Error。 在这种情况下，目录应该以 fs.mkdirSync 或类似的方式创建。
name 参数只能使用 app.getPath 定义过的 name
默认情况下, 网页的 cookie 和缓存将存储在 userData 目录下。 如果要更改这个位置, 你需要在 app 模块中的 ready 事件被触发之前重写 userData 的路径。

app.getVersion()
返回当前加载应用的版本，如果应用程序的 package. json 文件中找不到版本号, 则返回当前包或者可执行文件的版本。

app.getName()
返回 String-当前应用程序的名称, 它是应用程序的 package. json 文件中的名称。
根据 npm 的命名规则, 通常 package.json 中的 name 字段是一个短的小写字符串。 通常还应该指定一个 productName 字段, 是首字母大写的完整名称，用于表示应用程序的名称。Electron 会优先使用这个字段作为应用名。

试了一下，当只有name 没有productName时会返回tname的值；如果两个都存在时会返回productName的值

app.setName(name)
设置当前应用程序的名字
注意： 此函数会覆盖Electron内部使用的名称；它不会影响操作系统使用的名称。

app.getLocale()
返回应用所在区域

app.addRecentDocument(path)
将此 path 添加到最近打开的文件列表中。此列表由操作系统管理。 在Windows上，您可以从任务栏访问此列表，在macOS上，您可以从dock菜单访问。

app.clearRecentDocuments()
清空最近打开的文档列表

app.setAppUserModelId(id)
改变当前应用的 Application User Model ID 为 id

app.getAppMetrics()
返回 ProcessMetric[]: 包含所有与应用相关的进程的内存和CPU的使用统计的 ProcessMetric 对象的数组。

app.getGPUFeatureStatus()
返回 GPUFeatureStatus-来自 chrome://gpu/ 的图形功能状态。

app.isAccessibilitySupportEnabled()
如果开启了Chrome的辅助功能, 则返回 true，其他情况返false。 如果使用了辅助技术（例如屏幕阅读），该 API 将返回 true。

app.showAboutPanel()
显示应用程序的"关于"面板选项。 这些选项可以被 app.setAboutPanelOptions(可选) 所覆盖。

app.setAboutPanelOptions(options)

• 选项 对象
  • applicationName String (可选) - 应用程序的名字
  • applicationVersion String (可选) - 应用程序版本
  • copyright String (可选) - 版权信息
  • version String (可选) macOS - 应用程序版本号
  • credits String (可选) macOS Windows - 信用信息。
  • authors String[] (可选) Linux - 应用程序作者列表。
  • website String (可选) Linux - 应用程序的网站。
  • iconPath String (可选) Linux Windows - 以JPEG 或 PNG 文件格式为应用程序图标路径。 在 Linux 上，将显示为 64x64 像素，同时保留纵横比。

app.isEmojiPanelSupported()
返回 布尔值 - 当前操作系统版本是否允许使用本机emoji选取器。就是是否允许使用本机的表情

app.showEmojiPanel()
打开系统自身的emjio选取器。

app.on('ready', async () => {
  if (isDevelopment && !process.env.IS_TEST) {
    // Install Vue Devtools
    try {
      await installExtension(VUEJS3_DEVTOOLS)
    } catch (e) {
      console.error('Vue Devtools failed to install:', e.toString())
    }
  }
  createWindow()

  if(app.isEmojiPanelSupported()){
    app.showEmojiPanel()
  }
})

可以打开，但是点击任意按键会消失，没法截图

属性

app.accessibilitySupportEnabled
如果开启了Chrome的辅助功能，则返回 true，否则返回false

app.applicationMenu
如果设置 Menu ，则返回，否则返回 null

app.name
指明当前应用程序的名称，即应用程序 package.json 文件中的名称