JavaScript通知API允许网页在获用户授权后向桌面发送系统级提示；需调用requestPermission()获取许可，仅“granted”时可用new Notification()显示通知，并支持onclick等交互监听，兼容主流浏览器但存在平台差异。
JavaScript 通知 API（Notifications API）是浏览器提供的一套接口，允许网页在用户授权后向其操作系统桌面发送简短、醒目的消息提示，比如新消息提醒、任务完成通知等。它不依赖弹窗或页面内元素，而是直接出现在屏幕角落，类似系统级通知。
用户授权是前提
浏览器出于隐私和体验考虑，必须先获得用户明确许可，才能显示桌面通知。未经允许调用会静默失败。
- 调用 Notification.requestPermission() 弹出权限请求框（仅在用户交互触发时有效，比如点击按钮）
- 返回值是 "granted"、"denied" 或 "default"；只有 "granted" 时才能发通知
- 不要在页面加载时自动请求——多数浏览器会忽略，且影响用户体验
创建并显示一条通知
权限获批后，用 new Notification(title, options) 实例化通知对象即可显示：
-
title 是必填的字符串，作为通知标题（如 "你有一条新消息"）
-
options 是可选对象，常用字段包括：
• body：正文内容（支持换行，但建议简洁）
• icon：图标 URL（推荐 128×128 PNG，路径需同源或 HTTPS）
• b
adge：小徽章图标（用于 Android PWA 等场景）
• tag：唯一标识符，相同 tag 的新通知会替换旧通知
监听用户交互行为
通知不是单向广播，你可以响应用户的点击、关闭或权限变更：
-
notification.onclick：用户点击通知时触发（常用于跳转页面或聚焦窗口）
-
notification.onclose：用户手动关闭后执行（适合清理或统计）
-
Notification.permission 可随时读取当前状态，便于判断是否需要再次申请
- 注意：如果页面被关闭或标签页非活跃，onclick 仍可触发，但需确保目标页面能正确响应（例如通过 Service Worker 唤起）
兼容性与注意事项
主流浏览器（Chrome、Edge、Firefox、Safari 16.4+）均支持，但细节有差异：
- Safari 仅在 macOS 上支持，且要求网站加入“网站推送”白名单（需 Apple 审核）
- 移动端 Chrome 和 Firefox 支持，但部分 Android 厂商系统可能屏蔽或限制通知样式
- 通知内容不能含 HTML 或富文本，纯文本 + 图标是标准做法
- 频繁发送通知易被用户屏蔽，建议结合业务场景节制使用（如只对重要事件触发）
基本上就这些。通知 API 不复杂但容易忽略权限时机和跨平台差异，按需封装成工具函数会更稳妥。
adge：小徽章图标（用于 Android PWA 等场景）