JavaScript 使用 Notification API 发送浏览器通知，需用户授权且仅限 HTTPS 或 localhost；调用 requestPermission() 请求权限，检查 permission 状态后创建通知，并监听 onclick 等事件。
JavaScript 操作浏览器通知主要靠 Notification API，它允许网页向用户发送系统级通知（即使页面不在前台）。但必须先获得用户授权，且仅在安全上下文（https:// 或 localhost）中可用。
如何请求通知权限？
调用 Notification.requestPermission() 发起权限请求。该方法返回一个 Promise，在现代浏览器中推荐用 await 处理：
- 用户首次访问时会弹出浏览器原生权限提示（如“是否允许此网站发送通知？”）
- 返回值是
"granted"、"denied"或"default"（已废弃，现统一为"prompt"） - 不能自动触发，必须由用户手势（如点击按钮）触发，否则会被静默拒绝
示例：
document.getElementById('notifyBtn').addEventListener('click', async () => {
const permission = await Notification.requestPermission();
if (permission === 'granted') {
new Notification('你好！', { body: '这是一条通知' });
} else {
console.log('用户拒绝了通知权限');
}
});
如何检查当前权限状态？
使用 Notification.permission 可读取当前状态，无需再次请求：
立即学习“Java免费学习笔记（深入）”；
-
"granted"：已授权，可直接发通知 -
"denied"：被拒绝，后续调用requestPermission()不会再弹窗 -
"prompt"：未决定，可调用requestPermission()弹出授权框
建议每次发通知前都检查该值，避免无意义调用。
如何创建和自定义通知？
权限获准后，用 new Notification(title, options) 创建通知：
-
title：必填，显示在通知顶部的标题文本 -
options：对象，常用字段包括：
–body：正文内容
–icon：图标 URL（建议 192×192 或 512×512 PNG）
–badge：小图标（用于 Android 或桌面通知栏摘要）
–requireInteraction：设为true可阻止通知自动关闭
注意：部分选项（如 sound）已被主流浏览器移除，不再支持。
如何监听通知生命周期事件？
通知实例提供几个事件回调，可用于增强交互：
-
onclick：用户点击通知时触发（常用于跳转页面） -
onshow：通知成功显示后触发 -
onerror：通知因权限/参数等问题失败时触发 -
onclose：用户手动关闭或超时自动关闭后触发
示例：
const n = new Notification('新消息', { body: '点击查看' });
n.onclick = () => window.focus(); // 点击后聚焦当前窗口
基本上就这些。关键点是：权限需用户主动授予、必须 HTTPS/localhost、不能绕过交互触发、通知内容要简洁明确。
