点击通知无反应的根源是Service Worker注册失败或未在HTTPS/localhost下运行，需确保sw.js路径正确、作用域合理，并在notificationclick中用clients.openWindow()跳转。
点击通知后页面没反应？检查 Notification.permission 和作用域
HTML5 通知本身不带跳转能力，点击事件是否触发，取决于浏览器是否允许你监听它——而这又和通知权限、页面可见性、Service Worker 是否介入强相关。用户点通知时如果当前页面已关闭或处于后台，onclick 回调可能根本不会执行，除非你用了 Service Worker 拦截并转发事件。
常见错误现象：Notification.onclick 在 Chrome/Firefox 中完全不触发，控制台也没报错；或者只在 DevTools 打开时能触发（因为 devtools 会保持页面活跃）。
-
Notification.requestPermission()必须由用户手势（如 click）触发，不能在页面加载时自动调用 - 页面必须是 HTTPS（localhost 除外），否则
Notification构造失败，更别说监听 click - 若使用
Service Worker，需确保其已注册且激活，并在sw.js中监听notificationclick事件，而非页面 JS 里写onclick - 页面不可见时，只有
Service Worker能响应通知点击；纯页面 JS 的onclick只在页面前台且聚焦时有效
想跳转到指定页面？优先用 clients.openWindow() 而不是 window.location
在 Service Worker 的 notificationclick 事件中，你没有 window 对象，直接写 window.location = '...' 会报 ReferenceError: window is not defined。正确做法是通过 event.waitUntil() + clients.matchAll() 查找已有客户端，或用 clients.openWindow() 新开页面。
使用场景：用户从后台点击通知，需要打开或聚焦某个 URL（比如消息详情页）。
立即学习“前端免费学习笔记（深入）”；
-
clients.openWindow('https://example.com/msg/123')是标准且兼容性较好的方式（Chrome、Edge、Firefox 支持） - 如果目标页面已打开，可先
clients.matchAll({ type: 'window' })遍历，找到匹配url的 client 后调用client.focus() - 注意
openWindow()在部分 Firefox 版本中可能被弹窗拦截，建议 URL 是同源路径，且避免带过多 query 参数 - 不要在
notificationclick里直接postMessage给未激活的页面 client——它可能还没加载完，消息会丢失
serviceWorker.register() 失败导致通知点击无响应？检查路径和作用域范围
很多通知跳转失效，根源不在通知逻辑，而在 Service Worker 注册失败。一旦注册失败，notificationclick 就永远不会进入你的逻辑，页面 JS 的 onclick 又受限于前台状态，结果就是“点了没反应”。
典型错误信息：Uncaught (in promise) DOMException: Failed to register a ServiceWorker 或控制台显示 Failed to load resource: net::ERR_INVALID_RESPONSE。
-
navigator.serviceWorker.register('/sw.js')中的路径必须是**绝对路径**，且sw.js文件需返回Content-Type: text/javascript，不能是text/plain - 注册作用域默认为
sw.js所在路径，如果sw.js在/assets/sw.js，那它只能控制/assets/下的页面；应把sw.js放在根目录，或显式传入{ scope: '/' } - 开发时若用
file://协议，Service Worker 不可用；必须走 HTTP(S)，哪怕只是localhost:8080 - 修改过
sw.js后，浏览器可能缓存旧版本，强制刷新（Ctrl+Shift+R）或在 Application 面板里「Skip waiting」才能生效
为什么本地测试总失败？绕过 HTTPS 限制的临时方案仅限 localhost
Chrome 和 Edge 明确要求 Notification API 必须在安全上下文中运行，即 HTTPS 或 localhost。试图用 127.0.0.1、192.168.x.x 或自定义 hosts 域名（如 dev.test）都会被拒绝，连 requestPermission() 都不会弹窗。
容易踩的坑：开发环境用 Webpack Dev Server 默认绑 localhost 是 OK 的，但换成 --host 0.0.0.0 后地址变成 http://192.168.1.10:8080，通知立即失效。
- 确认浏览器地址栏显示的是
http://localhost:xxx，而不是 IP 或其他域名 - 不要依赖
location.hostname === 'localhost'来判断环境——它可能返回127.0.0.1，而后者在某些 Chromium 版本中也不被信任 - 生产环境必须配 HTTPS，Let’s Encrypt 免费证书 + Nginx 反向代理是最轻量的落地方式，别想着用 HTTP + 降级提示糊弄
- 移动端 Safari 完全不支持
NotificationAPI，iOS 上所有“通知跳转”方案都无效，这点常被忽略
