We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS



Push API 允许Web应用程序接收从服务器推送到它们的消息的能力,无论Web应用程序是否在用户代理的前台,或者甚至当前加载。这样,开发人员就可以向选择启用的用户投放异步通知和更新,从而更及时地吸引新内容。

Note: This documentation covers the W3C Push API specification; if you are looking for documentation on Firefox OS's proprietary push mechanism, see Simple Push.

Push 的概念及用法

对于一个应用来说,要想要接收到推送消息,需要有一个被激活的 service worker。当 service worker 处于激活状态时,可以使用 PushManager.subscribe() 来订阅推送通知。

PushSubscription 的结果包含了应用需要发送的推送消息的所有信息:端点及发送数据需要的加密密钥。

Service worker 会在必要的时候启动并接收接下来的推送消息,传递给 ServiceWorkerGlobalScope.onpush 事件句柄。该方法允许将接收到的推送消息使用在应用上,例如通过显示一条通知(使用 ServiceWorkerRegistration.showNotification()

每一个订阅对 service worker 来说都是唯一的。同时订阅的端点也是一个唯一的 功能性 URL:端点的信息是给应用发送信息的全部必要条件。所以端点地址需要保证隐私,否则其他应用也可以向你的应用发送消息。

激活一个 service worker 来提供推送消息会导致资源消耗的增加,尤其是电池。不同的浏览器对此有不同的方案——目前为止还没有标准的机制。Firefox 允许对发送给应用的推送消息做数量限制(配额)。该限制会在站点每一次被访问之后刷新。相比之下,Chrome 选择不做限制,但要求站点在每一次消息到达后都显示通知,这样可以让用户确认他们仍希望接收消息并确保用户可见性。



Note: As of Gecko 44, the allowed quota of push messages per application is not incremented when a new notification fires, when another is still visible, for a period of three seconds. This handles cases where a burst of notifications is received, and not all generate a visible notification.

Note: Chrome versions earlier than 52 require you to set up a project on Google Cloud Messaging to send push messages, and use the associated project number and API key when sending push notifications. It also requires an app manifest, with some special parameters to use this service.





Represents a push action sent to the global scope of a ServiceWorker. It contains information sent from an application to a PushSubscription.
Provides a way to receive notifications from third-party servers as well as request URLs for push notifications. This interface has replaced functionality offered by the obsolete PushRegistrationManager interface.
Provides access to push data sent by a server, and includes methods to manipulate the received data.
Provides a subcription's URL endpoint and allows unsubscription from a push service.

Service worker additions

The following additions to the Service Worker API have been specified in the Push API spec to provide an entry point for using Push messages. They also monitor and respond to push and subscription change events.

ServiceWorkerRegistration.pushManager 只读
Returns a reference to the PushManager interface for managing push subscriptions including subscribing, getting an active subscription, and accessing push permission status. This is the entry point into using Push messaging.
An event handler fired whenever a push event occurs; that is, whenever a server push message is received.
An event handler fired whenever a pushsubscriptionchange event occurs; for example, when a push subscription has been invalidated, or is about to be invalidated (e.g. when a push service sets an expiration time.)


Mozilla's ServiceWorker Cookbook 包含很多关于Push有用的示例.


Specification Status Comment
Push API Working Draft Initial definition


We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 42.0 44.0 (44.0)[1][3] 未实现[2] ? ?
未实现 44.0 (44.0)[3] 未实现 未实现 未实现
Feature Android Android Webview Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support 未实现 未实现 48.0 (48.0)[4] 未实现 ?[2] ? ? 42.0
未实现 未实现 48.0 (48.0)[4] 未实现 未实现 未实现 未实现 未实现





此页面的贡献者: vankai, xgqfrms-GitHub, jiraiya, ziyunfei, BettyCHEN
最后编辑者: vankai,