ServiceWorkerRegistration：showNotification() 方法

語法

showNotification(title)
showNotification(title, options)

引數

title

為通知定義一個標題，該標題會顯示在通知視窗的頂部。

options 可選

一個選項物件，其中包含您想要應用於通知的任何自定義設定。可能的選項包括：

actions 可選 實驗性

一個運算元組，將顯示在通知中，預設是一個空陣列。陣列中的每個元素都可以是一個具有以下成員的物件：

action

一個標識要在通知上顯示的使用者操作的字串。

title

一個包含要顯示給使用者的操作文字的字串。

icon 可選

一個包含要與操作一起顯示的圖示的 URL 的字串。

在 notificationclick 事件中，使用 event.action 構建適當的響應。

badge 可選 實驗性

一個字串，包含當沒有足夠空間顯示通知本身時用於表示通知的影像的 URL；例如，Android 通知欄。在 Android 裝置上，徽章應相容高達 4 倍解析度的裝置，約 96x96px，影像將被自動遮蔽。

body 可選

一個字串，表示通知的正文文字，顯示在標題下方。預設值是空字串。

data 可選 實驗性

您希望與通知關聯的任意資料。它可以是任何 結構化克隆演算法支援的資料型別。預設值是 null。

dir 可選

顯示通知的方向。預設值為 auto，它會根據瀏覽器的語言設定進行調整，但您可以透過設定 ltr 和 rtl 的值來覆蓋此行為（儘管大多數瀏覽器似乎會忽略這些設定）。

icon 可選

一個包含要在通知中顯示的圖示的 URL 的字串。

image 可選 實驗性

一個包含要在通知中顯示的影像的 URL 的字串。

lang 可選

通知的語言，使用表示 BCP 47 語言標籤 的字串指定。預設值是空字串。

renotify 可選 實驗性

一個布林值，指定使用者在新的通知替換舊通知後是否應該收到通知。預設值為 false，表示使用者不會收到通知。如果設定為 true，則 tag 也必須設定。

requireInteraction 可選 實驗性

指示通知應保持活動狀態，直到使用者點選或關閉它，而不是自動關閉。預設值為 false。

silent 可選

一個布林值，指定通知是否靜音（不發出聲音或振動），無論裝置設定如何。預設值 null 表示遵循裝置預設設定。如果設定為 true，則 vibrate 不能存在。

tag 可選

一個字串，表示通知的標識標籤。預設值是空字串。

timestamp 可選

一個時間戳，以毫秒為單位的 Unix 時間 表示，代表與通知相關的時間。當通知用於無法立即傳遞的訊息（因為裝置離線）時，這可能是在過去的時間，或者對於即將開始的會議，這可能是在未來。

vibrate 可選 實驗性

一個 振動模式，供裝置的振動硬體在發出通知時使用。如果指定，則 silent 必須不是 true。

返回值

一個 Promise，解析為 undefined。

異常

TypeError

在以下情況下丟擲

• 當前 Service Worker 的狀態不是 activating 或 activated。
• 使用者已明確拒絕瀏覽器使用該 API 的許可權請求。
• silent 選項為 true，並且指定了 vibrate 選項。
• renotify 選項為 true，但 tag 選項為空。

DataCloneError DOMException

如果 data 選項的序列化因某種原因失敗，則丟擲此異常。

示例

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() 來檢索從當前 Service Worker 發出的 Notification 的詳細資訊。

規範

瀏覽器相容性