如何进行Web Push功能检测？

Question

有没有简单的方法来检测桌面和移动浏览器中 Web Push API 的功能？

- Prashant Agrawal

Answer 1

有些浏览器版本仅支持Service Worker而不支持Push API。

建议检测Push API本身。

如果您需要以同步方式（即不等待Promise）检查浏览器支持情况，可以使用此代码（从Pushpad SDK复制）：

function isPushApiSupported() {
  return 'PushManager' in window;
}

- collimarco

---

有趣的是，我不知道有些浏览器不支持 Push API 但支持 Service Workers！它们是哪些浏览器？ - Marco Castelluccio

Firefox移动版支持ServiceWorker，但不支持Push API。 - Prashant Agrawal

这个检查在 Service Worker 中不起作用，因为窗口对象在那里根本不可用。 - Rednael

@Marco 还有 Safari 12 - Martin Ždila

Answer 2

目前，任何支持Service Workers的浏览器也支持Web Push。

因此，只需检查navigator是否具有serviceWorker属性。

如果您担心将来某些浏览器在支持Web Push之前开始支持Service Workers，可以使用以下类似代码：

navigator.serviceWorker.getRegistration()
.then(function(registration) {
  if (registration.pushManager) {
    // Web Push supported.
  } else {
    // Web Push not supported.
  }
});

- Marco Castelluccio

---

如果服务工作者没有控制当前页面，则“registration”为“null”。 - Jason

在我看来，这将是最佳解决方案，因为这个检查也可以在 Service Worker 中完成。被接受的答案使用了 window 对象，而在 Service Worker 中不可用。 - Rednael

这是不正确的。长期以来，直到现在（04/22），Safari支持ServiceWorkers但不支持Push。 - Lukáš Řádek