html5 Notification API 可在 浏览器 外推送桌面通知，实现类似 微信 的消息提醒；需先检查浏览器支持并获取用户授权，再通过 new Notification()创建通知，可设置标题、内容、图标及点击交互，并建议对不支持的环境做兼容降级处理。
要在网页中实现像 微信 一样的桌面消息提醒，html5的 Notification API 是核心方案。这个功能能让网站在 浏览器 外给用户推送通知，即使页面被最小化也能看到，非常适合做在线聊天、系统告警这类需要即时触达用户的场景。
检查支持与申请权限
不是所有浏览器都支持这个功能，动手前得先确认环境是否允许。可以用简单的判断语句来检测：
if (‘Notification’ in window) {/* 支持 */}
光支持还不够，浏览器出于安全考虑会阻止随意弹窗。必须向用户申请授权，常见的做法是在用户有明确交互（比如点击按钮）时发起请求：
Notification.requestPermission().then(permission => { if (permission === ‘granted’) {// 用户同意了，可以发通知} });
用户的选择会被记住，下次就不用反复申请。权限状态只有三种：同意（granted）、拒绝（denied）、未决定（default）。
立即学习 “ 前端免费学习笔记（深入）”；
创建 并发 送通知
拿到权限后，就可以创建通知了。使用 new Notification() 构造函数，传入标题和配置项就行：
new Notification(‘ 新消息 ’, { body: ‘ 您有一条未读信息 ’, icon: ‘/icon.png’});
这里 title 是必填的显示标题，options对象 里可以设置更多内容。body 是通知正文，icon 能指定一个图标路径，让提示更直观。还可以加 tag 参数，相同 tag 的通知会替换旧的，避免刷屏。
增强交互与兼容处理
通知不只是看一眼，还能让用户点击后执行操作。通过 onclick事件 可以定义点击通知时的行为，比如跳转到特定页面或聚焦聊天窗口：
const notify = new Notification(‘…’); notify.onclick = function() { window.focus();};
别忘了考虑兼容性问题，ios的 safari 目前还不支持这个 API。上线前最好做个降级处理，比如当不支持时，退回到闪烁标签栏的传统方式，确保基础功能可用。
基本上就这些。
