Web Push通知必须依赖Service Worker，因推送链路为：前端订阅→后端保存subscription→后端调Web Push协议→浏览器触发push事件→SW中调showNotification显示。
浏览器原生 Push 通知必须依赖 Service Worker，没有它就根本发不出推送——不是权限问题，是技术上不可行。
为什么调用 Notification.requestPermission() 没反应？
常见于未启用 HTTPS 或未注册 Service Worker 的页面。HTTP 协议下 Chrome/Firefox 会直接禁用 Notification API；即使本地 localhost 可用，也必须确保 Service Worker 已成功注册并处于 activated 状态。
- 检查控制台是否报错
Failed to register a ServiceWorker: The script has an unsupported MIME type ('text/html')——说明路径返回了 HTML 而非 JS，确认navigator.serviceWorker.register('/sw.js')中的路径真实存在且响应头为Content-Type: application/javascript -
Notification.requestPermission()必须由用户手势触发（如点击按钮），不能在页面加载时自动调用，否则多数浏览器会静默拒绝 - 若已授权却仍无弹窗，检查系统级通知设置（macOS 的“通知中心”、Windows 的“系统 > 通知和操作”）是否禁用了该域名
Push API 发送通知前必须完成哪三步？
不是调个 showNotification() 就完事。整个链路是：前端订阅 → 后端保存 subscription → 后端调用 Push 服务（如 WebPush 协议）→ 浏览器触发 push 事件 → Service Worker 手动调用 self.registration.showNotification()。
- 前端获取
subscription对象需调用registration.pushManager.subscribe()，注意它返回的是 Promise，且需传入{userVisibleOnly: true, applicationServerKey: urlBase64ToUint8Array(...)} -
applicationServerKey是 VAPID 公钥，必须是 URL-safe Base64 编码的 88 字符字符串（对应 65 字节），少一位或多一位都会导致InvalidStateError - 后端发送 Push 请求时，
Authorization头必须按 VAPID 规范构造，包括vapid t=..., k=...，且签名有效期建议 ≤24 小时，过期会返回401 Unauthorized
self.registration.showNotification() 显示异常或不出现？
这是最常被忽略的一环：Push 消息到达后，浏览器不会自动弹窗，必须在 Service Worker 的 push 事件监听器里显式调用它，且不能在异步回调（如 fetch 完成后）里调用——因为事件上下文可能已销毁。
- 务必在
event.waitUntil()内包裹整个逻辑，防止 SW 在通知显示前被终止：event.waitUntil(self.registration.showNotification('标题', {body: '内容'})) - 避免在
showNotification()中传入非法字段，如icon路径 404、image不是 HTTPS 地址、data是函数或 undefined——这些会导致静默失败 - Chrome 120+ 对重复通知做了限制：同一 origin 下 2 秒内多次调用
showNotification()且tag相同，新通知会替换旧的；若想强制显示，需每次传不同tag或清空tag
真正卡住人的往往不是代码写法，而是 VAPID 密钥生成方式不对、SW 缓存导致旧版本没更新、或者后端推送时没正确处理 WebPush 库的 promise rejection（比如 subscription 过期后还硬推，会触发 410 Gone 但程序没捕获）。调试时优先看 Network 面板里 push 请求的响应状态码，而不是只盯着控制台有没有 JS 错误。
大量免费API接口：立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游，为数据API应用能力赋能！
