Chrome Web Push 失败主因是环境不满足硬性条件：必须 HTTPS（localhost 除外）+ 用户授权 + Service Worker 正确注册激活；常见问题包括协议非安全、SW 文件响应异常、scope 错误、隐私模式屏蔽、pushManager 未就绪、VAPID 格式错误及 FCM 链路中断。
Chrome 浏览器中 HTML5 推送（即基于 Push API 和 Service Worker 的 Web Push）收不到，绝大多数情况不是“没开启”，而是根本没通过 Chrome 的推送准入条件——必须是 HTTPS 环境 + 用户显式授权 + Service Worker 正确注册并激活。本地 http://localhost 可以调试，但任何非 localhost 的 HTTP 域名（比如 http://example.com）会被 Chrome 直接禁用 Notification 和 PushManager。
为什么 navigator.serviceWorker.register() 失败或不触发推送权限请求
常见现象：调用 register() 后无反应、Promise pending、控制台报 Failed to register a ServiceWorker 或 Only secure origins are allowed。
- 当前页面协议不是 HTTPS（或非
localhost），Chrome 拒绝注册 Service Worker —— 这是硬性限制，无法绕过 -
service-worker.js文件返回了非200状态码（如 404、403、301），或响应头含Content-Type: text/html（应为application/javascript） - 注册路径错误：例如在
/admin/路径下执行navigator.serviceWorker.register('/sw.js')，但未指定scope，导致 SW 只能控制/admin/sw.js同级路径，无法拦截根路径推送事件 - 浏览器隐私模式、第三方 Cookie 阻止策略或某些插件（如 uBlock Origin、Ghostery）会主动屏蔽
registration.pushManager初始化
为什么 pushManager.subscribe() 报错或返回空对象
典型错误：DOMException: Registration failed - permission denied、TypeError: Cannot read property 'subscribe' of undefined、或返回的 PushSubscription 对象里 endpoint 为空。
-
pushManager是异步初始化的，必须等serviceWorker.ready后再调用，不能在register()的 then 回调里直接链式调用 - 用户从未点击过通知授权弹窗（
Notification.requestPermission()返回"default"），或之前点过“阻止”，此时pushManager.subscribe()会静默失败 - Chrome 80+ 默认禁用第三方站点的推送订阅（尤其跨域 iframe 场景），需确保调用发生在主帧且由用户手势（如 click）触发
- 后端生成的 VAPID 公钥格式错误（例如没去掉换行、没转 Base64URL）、或私钥签名时未使用
sha256+pem格式，会导致 Chrome 拒绝订阅
如何验证 Chrome 是否真正收到推送消息
即使前端订阅成功，消息也可能卡在 Google 的 FCM（Firebase Cloud Messaging）中，或被 Chrome 主动丢弃。不要只看后端返回 201，要查真实送达链路。
立即学习“前端免费学习笔记（深入）”；
- 打开
chrome://serviceworker-internals/，找到对应 SW，点击「Unregister」再刷新页面重试，排除旧缓存干扰 - 在 SW 文件中添加
self.addEventListener('push', e => { console.log('PUSH RECEIVED:', e); })，然后用cURL或 Postman 模拟发送推送（注意 endpoint 必须带Authorization和Encryption头） - 检查 Chrome 地址栏左侧的锁图标 → “网站设置” → 查看“通知”是否为“允许”，且“推送”权限已启用（Chrome 111+ 将推送权限和通知分离，需单独确认）
- 若用 Firebase SDK（
firebase-messaging），确保初始化时传入了正确的firebaseConfig和vapidKey，且messaging.getToken()返回的是有效 endpoint（以https://fcm.googleapis.com/fcm/send/...开头）
curl -X POST \
https://fcm.googleapis.com/fcm/send \
-H "Authorization: key=YOUR_SERVER_KEY" \
-H "Content-Type: application/json" \
-d '{
"to": "YOUR_ENDPOINT",
"notification": {
"title": "Test",
"body": "From cURL"
}
}'真正卡点往往不在代码写法，而在环境信任链：HTTPS 证书是否被 Chrome 认可（自签证书不行）、VAPID 密钥对是否由同一套工具生成、推送 endpoint 是否过期（Chrome 会定期轮换）。每次改完配置，务必清空 chrome://settings/content/notifications 中的站点权限并重启浏览器。
