通知（Notifications）
- 用法
  - 在主进程中显示通知
  - 在渲染进程中显示通知
- 不同平台注意事项

通知（Notifications）

每个操作系统都有自己的机制向用户显示通知。 Electron的通知 API 是跨平台的，但对每个进程类型来说是不同的。

如果您想要在主进程中使用渲染器进程 API，或者要在渲染器进程中使用主进程 API，请考虑使用进程间通信

用法

下面是两个关于如何显示每个进程类型的通知的示例。

在主进程中显示通知

主进程通知使用Electron的通知模块显示。使用此模块创建的通知对象不会立刻显示，除非调用他们的 show() 实例方法。

Main Process

const { Notification } = require('electron')
const NOTIFICATION_TITLE = 'Basic Notification'
const NOTIFICATION_BODY = 'Notification from the Main process'
new Notification({
  title: NOTIFICATION_TITLE,
  body: NOTIFICATION_BODY
}).show()

下面是您可以使用 Electron Fiddle 打开的完整示例：

docs/fiddles/features/notifications/main (27.0.1)Open in Fiddle

main.js
index.html

const { app, BrowserWindow, Notification } = require('electron')
function createWindow () {
  const win = new BrowserWindow({
    width: 800,
    height: 600
  })
  win.loadFile('index.html')
}
const NOTIFICATION_TITLE = 'Basic Notification'
const NOTIFICATION_BODY = 'Notification from the Main process'
function showNotification () {
  new Notification({ title: NOTIFICATION_TITLE, body: NOTIFICATION_BODY }).show()
}
app.whenReady().then(createWindow).then(showNotification)
app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})
app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
</head>
<body>
    <h1>Hello World!</h1>
    <p>After launching this application, you should see the system notification.</p>
</body>
</html>

在渲染进程中显示通知

通知可以直接在渲染进程中使用 Web Notifications API 显示。

Renderer Process

const NOTIFICATION_TITLE = 'Title'
const NOTIFICATION_BODY =
  'Notification from the Renderer process. Click to log to console.'
const CLICK_MESSAGE = 'Notification clicked'
new Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY }).onclick =
  () => console.log(CLICK_MESSAGE)

下面是您可以使用 Electron Fiddle 打开的完整示例：

docs/fiddles/features/notifications/renderer (27.0.1)Open in Fiddle

main.js
index.html
renderer.js

const { app, BrowserWindow } = require('electron')
function createWindow () {
  const win = new BrowserWindow({
    width: 800,
    height: 600
  })
  win.loadFile('index.html')
}
app.whenReady().then(createWindow)
app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})
app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Hello World!</title>
    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
</head>
<body>
    <h1>Hello World!</h1>
    <p>After launching this application, you should see the system notification.</p>
    <p id="output">Click it to see the effect in this interface.</p>
    <script src="renderer.js"></script>
</body>
</html>

const NOTIFICATION_TITLE = 'Title'
const NOTIFICATION_BODY = 'Notification from the Renderer process. Click to log to console.'
const CLICK_MESSAGE = 'Notification clicked!'
new window.Notification(NOTIFICATION_TITLE, { body: NOTIFICATION_BODY })
  .onclick = () => { document.getElementById('output').innerText = CLICK_MESSAGE }

不同平台注意事项

虽然操作系统的代码和用户体验相似，但依然存在微妙的差异。

Windows

对于Windows上的通知您的 Electron 应用需要有一个带有 AppUserModelID 和对应的 ToastActivatorCLSID 的开始菜单快捷方式。

Electron 尝试使AppUserModelID 和 ToastActivatorCLSID的工作自动化。 Electron在和安装和更新框架 Squirrel 一起使用的时候，Windows (例如你正在使用electron-winstaller)快捷方式将被自动正确的配置好。

在生产环境中，Electron 会自动检测 Squirrel 的存在，并且使用正确的值来自动调用app.setAppUserModelId()。在开发的过程中, 你可能需要自己调用app.setAppUserModelld()

开发环境中显示通知

为了快速实现开发模式下显示通知，因为将 node_modules\electron\dist\electron.exe 添加到您的开始菜单也可以解决问题。导航到资源管理器中的文件，右键单击并选择 “固定到开始菜单”。然后，在主进程中调用 app.setAppUserModelId(process.execPath) 以查看通知。

使用高级通知

Windows还允许使用自定义模板、图像和其他灵活的元素进行高级通知。

要从主进程发送这些通知，您可以使用用户空间模块 electron-windows-notifications ，它使用本机Node插件发送ToastNotification 和 TileNotification 对象。

当包括按钮在内的通知使用 electron-windows-notifications 时，处理回复需要使用 electron-windows-interactive-notifications 帮助注册所需的 COM 组件并调用您的 Electron 应用程序和输入的用户数据。

查询通知状态

要检测是否允许发送通知，请使用用户空间的 windows-notification-state 模块。

该模块允许你事先确定 Windows 是否会静默丢弃通知。

macOS

在macOS上发送通知很简单，你应该参考苹果关于通知的人机界面指南。

请注意，通知的大小限制为256个字节，如果超过该限制，则会被截断。

查询通知状态

要检测是否允许发送通知，可以使用用户空间的macos-notification-state模块。

该模块允许你事先确定通知是否会被显示。

Linux

在Linux上，通知是使用libnotify发送的，它可以在遵循桌面通知规范的任何桌面环境上显示通知，包括Cinnamon、Enlightenment、Unity、GNOME和KDE。