ServiceWorkerRegistration: showNotification() 方法

安全上下文:此功能仅在安全上下文(HTTPS)中可用,在某些或所有支持的浏览器中可用。

注意:此功能在Web 工作线程中可用。

showNotification() 方法是 ServiceWorkerRegistration 接口的方法,它在活动的服务工作线程上创建通知。

语法

js
showNotification(title)
showNotification(title, options)

参数

title

必须在通知中显示的标题。

options 可选

允许配置通知的对象。它可以具有以下属性

actions 可选 实验性

要在通知中显示的操作数组。数组中的每个元素都是一个对象,具有以下成员

action

标识要显示在通知上的用户操作的字符串。

title

要显示给用户的操作文本字符串。

icon 可选

包含要与操作一起显示的图标的 URL 的字符串。

适当的响应是使用notificationclick 事件中的 event.action 构建的。

badge 可选 实验性

包含图像的 URL 的字符串,当没有足够的空间显示通知本身时,例如 Android 通知栏,该图像将代表通知。在 Android 设备上,徽章应该适应高达 4 倍分辨率的设备,大约 96 x 96 像素,图像将被自动遮罩。

body 可选

表示要显示在通知内的额外内容的字符串。

data 可选 实验性

您希望与通知关联的任意数据。这可以是任何数据类型。

dir 可选

通知的方向;可以是 autoltrrtl

icon 可选

包含要由通知用作图标的图像的 URL 的字符串。

image 可选 实验性

包含要显示在通知中的图像的 URL 的字符串。

lang 可选

指定通知中使用的语言。此字符串必须是根据RFC 5646:标识语言的标签(也称为 BCP 47)的有效语言标签。

renotify 可选 实验性

一个布尔值,指示在重复使用 tag 值时是否抑制振动和声音警报。如果optionsrenotifytrueoptionstag 为空字符串,则会抛出 TypeError。默认值为 false

requireInteraction 可选 实验性

指示在屏幕足够大的设备上,通知应保持活动状态,直到用户单击或将其关闭。如果此值缺失或为 false,则 Chrome 的桌面版本将在大约 20 秒后自动最小化通知。默认值为 false

silent 可选

设置为指示不应发出任何声音或振动。如果optionssilenttrueoptionsvibrate 存在,则会抛出 TypeError 异常。默认值为 false

tag 可选

给定通知的 ID,允许您在必要时使用脚本查找、替换或删除通知。

timestamp 可选

时间戳,以毫秒为单位的Unix 时间,表示与通知关联的时间。这可能是在过去,当通知用于无法立即传递的消息时,因为设备处于脱机状态,或者在未来,用于即将开始的会议。

vibrate 可选 实验性

与通知显示一起运行的振动模式。振动模式可以是至少包含一个成员的数组。这些值以毫秒为单位,其中偶数索引(0、2、4 等)指示振动持续时间,奇数索引指示暂停持续时间。例如,[300, 100, 400] 将振动 300 毫秒,暂停 100 毫秒,然后振动 400 毫秒。

返回值

一个Promise,解析为 undefined

异常

TypeError

如果当前服务工作线程的状态不是 activatingactivated,或者如果用户已明确拒绝浏览器使用 API 的权限请求,则抛出。

示例

js
navigator.serviceWorker.register("sw.js");

function showNotification() {
  Notification.requestPermission().then((result) => {
    if (result === "granted") {
      navigator.serviceWorker.ready.then((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",
        });
      });
    }
  });
}

要在适当的时间调用上述函数,您可以监听notificationclick 事件。

您还可以使用ServiceWorkerRegistration.getNotifications()检索从当前服务工作线程发出的Notification的详细信息。

规范

规范
通知 API 标准
# dom-serviceworkerregistration-shownotification

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。