ServiceWorkerRegistration.showNotification()

Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

The showNotification() method of the ServiceWorkerRegistration interface creates a notification on an active service worker.

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 Необязательный
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.
    Appropriate responses are built using event.action within the notificationclick event.
  • badge: The URL of an image to represent the notification when there is not enough space to display the notification itself such as, for example, the Android Notification Bar. On Android devices, the badge should accommodate devices up to 4x resolution, about 96 by 96 px, and the image will be automatically masked.
  • body: A string representing an extra content to display within the notification.
  • dir : The direction of the notification; it can be auto, ltr, or rtl
  • icon: URL или base64 версия картинки, которая отображается сбоку от нотификации.
  • image: URL USVSTring картинки, которая отобрадается снизу нотификации.
  • 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 a tag 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 is false.
  • 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'
        });
      });
    }
  });
}

To invoke the above function at an appropriate time, you could use the ServiceWorkerGlobalScope.onnotificationclick event handler.

You can also retrieve details of the Notifications have have been fired from the current service worker using ServiceWorkerRegistration.getNotifications().

Specifications

Specification Status Comment
Notifications API
Определение 'showNotification()' в этой спецификации.
Живой стандарт Initial definition.

Browser compatibility

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidEdge MobileFirefox для AndroidOpera для AndroidiOS SafariSamsung Internet
Базовая поддержка
Экспериментальная
Chrome Полная поддержка 40Edge Полная поддержка 17
Полная поддержка 17
Полная поддержка 16
Отключено
Отключено From version 16: this feature is behind the Enable service workers preference.
Firefox Полная поддержка 46
Замечания
Полная поддержка 46
Замечания
Замечания Service workers (and Push) have been disabled in the Firefox 45 and 52 Extended Support Releases (ESR).
IE Нет поддержки НетOpera Полная поддержка 27Safari Нет поддержки НетWebView Android Полная поддержка 40Chrome Android Полная поддержка 40Edge Mobile ? Firefox Android Полная поддержка 46Opera Android Полная поддержка 27Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 4.0
actions
Экспериментальная
Chrome Полная поддержка 45Edge ? Firefox Нет поддержки НетIE Нет поддержки НетOpera Полная поддержка 32Safari Нет поддержки НетWebView Android Полная поддержка 45Chrome Android Полная поддержка 45Edge Mobile ? Firefox Android Нет поддержки НетOpera Android Полная поддержка 32Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 5.0
badge
Экспериментальная
Chrome Полная поддержка 53Edge ? Firefox Нет поддержки НетIE Нет поддержки НетOpera Полная поддержка 39Safari Нет поддержки НетWebView Android Полная поддержка 53Chrome Android Полная поддержка 53Edge Mobile ? Firefox Android Нет поддержки НетOpera Android Полная поддержка 39Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 6.0
data
Экспериментальная
Chrome Полная поддержка 44Edge ? Firefox Нет поддержки НетIE Нет поддержки НетOpera Полная поддержка 31Safari Нет поддержки НетWebView Android Полная поддержка 44Chrome Android Полная поддержка 44Edge Mobile ? Firefox Android Нет поддержки НетOpera Android Полная поддержка 31Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 4.0
image
Экспериментальная
Chrome Полная поддержка 56Edge ? Firefox Нет поддержки НетIE Нет поддержки НетOpera Полная поддержка 43Safari Нет поддержки НетWebView Android Полная поддержка 56Chrome Android Полная поддержка 56Edge Mobile ? Firefox Android Нет поддержки НетOpera Android Полная поддержка 43Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 6.0
renotify
Экспериментальная
Chrome Полная поддержка 50Edge ? Firefox Нет поддержки НетIE Нет поддержки НетOpera Полная поддержка 37Safari Нет поддержки НетWebView Android Полная поддержка 50Chrome Android Полная поддержка 50Edge Mobile ? Firefox Android Нет поддержки НетOpera Android Полная поддержка 37Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 5.0
requireInteraction
Экспериментальная
Chrome Полная поддержка 47Edge ? Firefox Нет поддержки НетIE Нет поддержки НетOpera Полная поддержка 34Safari Нет поддержки НетWebView Android Полная поддержка 47Chrome Android Полная поддержка 47Edge Mobile ? Firefox Android Нет поддержки НетOpera Android Полная поддержка 34Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 5.0
vibrate
Экспериментальная
Chrome Полная поддержка 45Edge ? Firefox Нет поддержки НетIE Нет поддержки НетOpera Полная поддержка 32Safari Нет поддержки НетWebView Android Полная поддержка 45Chrome Android Полная поддержка 45Edge Mobile ? Firefox Android Нет поддержки НетOpera Android Полная поддержка 32Safari iOS Нет поддержки НетSamsung Internet Android Полная поддержка 5.0

Легенда

Полная поддержка  
Полная поддержка
Нет поддержки  
Нет поддержки
Совместимость неизвестна  
Совместимость неизвестна
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Экспериментальная. Ожидаемое поведение может измениться в будущем.
Смотрите замечания реализации.
Смотрите замечания реализации.
Пользователь должен сам включить эту возможность.
Пользователь должен сам включить эту возможность.

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 Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
vibrate option 45 ? Нет ? 32 ?
requireInteraction 47 ? Нет ? ? ?
actions option 48 ? Нет ? ? ?
renotify option 50 ? Нет ? 37 ?
badge option 53 ? ? ? 39 ?
image option 56 ? ? ? ? ?
data option 44 ? Нет Нет ? Нет
Feature Android Android Webview Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
vibrate option Нет Нет Нет Нет ? 32 ? 45
requireInteraction Нет Нет Нет Нет ? ? ? 47
actions option Нет Нет Нет Нет ? ? ? 48
renotify option Нет Нет Нет Нет ? 37 ? 50
badge option Нет Нет ? ? ? 39 ? 53
image option Нет Нет ? ? ? ? ? 56
data option Нет Нет Нет Нет Нет ? Нет 44

Метки документа и участники

Внесли вклад в эту страницу: MikitaDu
Обновлялась последний раз: MikitaDu,