我们的志愿者还没有将这篇文章翻译为 中文 (简体)。加入我们帮助完成翻译!
This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.
The showNotification()
method of the ServiceWorkerRegistration
interface creates a notification on an active service worker.
Note: To retrieve the created Notification
object, you need to use ServiceWorkerRegistration.getNotifications()
or lServiceWorkerGlobalScope.onnotificationclick
.
Note: This feature is available in Web Workers.
Syntax
ServiceWorkerRegistration.showNotification(title, [options]).then(function(NotificationEvent) { ... });
Returns
A Promise
that resolves to a NotificationEvent
.
Parameters
title
- The title that must be shown within the notification
options
Optional- An object that allows to configure the notification. It can have the following properties:
actions
: An array of actions to display in the notification. The members of the array should be an object literal. It may contain the following values:- action: A
DOMString
identifying a user action to be displayed on the notification. - title: A
DOMString
containing action text to be shown to the user. - icon: A
USVString
containg the URL of an icon to display with the action.
event.action
within thenotificationclick
event.- action: A
body
: A string representing an extra content to display within the notification.dir
: The direction of the notification; it can beauto
,ltr
, orrtl
icon
: The URL of an image to be used as an icon by the notification.lang
: Specify the lang used within the notification. This string must be a valid BCP 47 language tag.renotify
: A boolean that indicates whether to supress vibrations and audible alerts when resusing atag
value. The default is false.requireInteraction
: Indicates that on devices with sufficiently large screens, a notification should remain active until the user clicks or dismisses it. If this value is absent or false, the desktop version of Chrome will auto-minimize notifications after approximately twenty seconds. The default value isfalse
.tag
: An ID for a given notification that allows you to find, replace, or remove the notification using script if necessary.vibrate
: A vibration pattern to run with the display of the notification. A vibration pattern can be an array with as few as one member. The values are times in milliseconds where the even indices (0, 2, 4, etc.) indicate how long to vibrate and the odd indices indicate how long to pause. For example[300, 100, 400]
would vibrate 300ms, pause 100ms, then vibrate 400ms.data
: Arbitrary data that you want associated with the notification. This can be of any data type.
Examples
navigator.serviceWorker.register('sw.js'); function showNotification() { Notification.requestPermission(function(result) { if (result === 'granted') { navigator.serviceWorker.ready.then(function(registration) { registration.showNotification('Vibration Sample', { body: 'Buzz! Buzz!', icon: '../images/touch/chrome-touch-icon-192x192.png', vibrate: [200, 100, 200, 100, 200, 100, 200], tag: 'vibration-sample' }); }); } }); }
Specifications
Specification | Status | Comment |
---|---|---|
Notifications API The definition of 'showNotification()' in that specification. |
Recommendation | Initial definition. |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 42 | 44.0 (44.0)[1] | ? | ? | ? |
vibrate option |
45 | No support | |||
requireInteraction |
47 | No support | |||
actions option |
48 | No support | |||
renotify option |
50 | No support |
Feature | Android | Android Webview | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
Basic support | No support | No support | 44.0 (44.0) | (Yes) | ? | ? | ? | 42 |
vibrate option |
No support | No support | No support | No support | 45 | |||
requireInteraction |
No support | No support | No support | No support | 47 | |||
actions option |
No support | No support | No support | No support | 48 | |||
renotify option |
No support | No support | No support | No support | 50 |
[1] Service workers (and Push) have been disabled in the Firefox 45 Extended Support Release (ESR.)