本頁面由 Cloud Translation API 翻譯而成。

通知觸發 API

「通知觸發條件」可讓您安排不需網路連線的本機通知，非常適合使用日曆應用程式等用途。

Thomas Steiner

什麼是通知觸發條件？

網頁開發人員可以使用 Web Notifications API。這項功能通常與 Push API，用來通知使用者俱有時效性的資訊，例如例如即時新聞事件或已收到訊息如要顯示通知，請在使用者的裝置。

Push API 的問題在於，它不可靠觸發通知，「必須」會在符合特定條件 (例如時間或地點) 時顯示。以時間為依據的範例限制條件：日曆通知提醒您與老闆在重要會議中，下午 2 點。以通知提醒您買牛奶就會看到貴公司的相關資訊網路連線或節約耗電量打盹模式等功能可能會延遲推送通知的傳送時間。

「通知」觸發條件可讓你排定通知觸發時間，藉此解決這個問題，作業系統才能適時傳送通知即使沒有網路連線或裝置處於省電模式也沒問題。

用途

日曆應用程式可以使用時間型通知觸發條件，提醒使用者即將開始安排會議時間日曆應用程式的預設通知配置可以是第一個抬頭通知開會前一小時通知，之後又再發送一則緊急通知 5 分鐘。

電視網路可能會提醒使用者喜愛的電視節目即將開始或開會直播即將開始串流播放

時區轉換網站可以使用以時間為準的通知觸發條件，讓使用者安排時間電話會議或視訊通話的鬧鐘

目前狀態

步驟	狀態
1. 建立說明	完成
2. 建立規格的初始草稿	尚未開始
3. 收集意見回饋並反覆改進設計。	進行中
4. 來源試用	完成
5. 啟動	尚未開始

如何使用通知觸發條件

透過 about://flags 啟用

如要在不使用來源試用權杖的情況下在本機試用 Notification Triggers API，請啟用 about://flags 中的 #enable-experimental-web-platform-features 標記。

特徵偵測

您可以透過檢查是否存在 showTrigger 屬性：

if ('showTrigger' in Notification.prototype) {
  /* Notification Triggers supported */
}

排定通知時間

排定通知時間與顯示一般推播通知類似，只是您需要傳遞 showTrigger 條件屬性，並將 TimestampTrigger 物件的值做為值傳遞給通知的 options 物件。

const createScheduledNotification = async (tag, title, timestamp) => {
  const registration = await navigator.serviceWorker.getRegistration();
  registration.showNotification(title, {
    tag: tag,
    body: 'This notification was scheduled 30 seconds ago',
    showTrigger: new TimestampTrigger(timestamp + 30 * 1000),
  });
};

敬上

取消已排定的通知

如要取消排定的通知，請先索取一份清單，內含符合特定項目的所有通知標記之前的 ServiceWorkerRegistration.getNotifications() 標記。請注意，您必須傳送 includeTriggered 標記，用於將已排定的通知加入清單中：

const cancelScheduledNotification = async (tag) => {
  const registration = await navigator.serviceWorker.getRegistration();
  const notifications = await registration.getNotifications({
    tag: tag,
    includeTriggered: true,
  });
  notifications.forEach((notification) => notification.close());
};

偵錯

您可以使用 Chrome 開發人員工具通知面板來偵錯通知。開始偵錯，請按下「Start record event」(開始記錄事件) 或 Control + E 鍵 (在 Mac 上為 Command + E 鍵)。Chrome 開發人員工具記錄所有通知事件，包括排程、顯示與關閉的通知即使您關閉開發人員工具

系統會將排定的通知事件記錄到 Chrome 開發人員工具的「通知」窗格 (位於應用程式面板中)。 — 已排定的通知。

Chrome 開發人員工具的「通知」窗格會記錄顯示的通知事件。 — 畫面上顯示的通知。

示範

您可以在示範中瞭解通知觸發條件的實際運作情形，以便安排時間列出及取消排定的通知您可以在 Glitch：

安全性和權限

Chrome 團隊根據核心原則設計並實作 Notification Triggers API 定義，包括控管強大的 Web Platform 功能存取權，包括使用者掌控權、透明度和人體工學由於此 API 需要 Service Worker，因此也需要安全內容。使用 API 所需的權限與一般推播通知相同。

使用者控制項

這個 API 僅適用於 ServiceWorkerRegistration 的內容。這表示所需資料會儲存在相同情境中，並在服務工作處理程序使用者刪除或刪除來源的所有網站資料。封鎖 Cookie 也會使服務無法運作避免在 Chrome 中安裝工作站，因此不得使用這個 API。通知一律在網站設定中停用該網站。

透明度

與 Push API 不同，這個 API 不需要網路，它可能表示已排定的通知需要事先處理所有必要資料，包括 badge、icon 和 image 屬性。這表示開發人員無法觀測到已排定的通知在使用者與通知互動之前，不要喚醒 Service Worker。因此，開發人員目前無法取得使用者相關資訊，例如 IP 位址地理位置查詢。這種設計可讓功能視需要加入作業系統提供的排程機制例如 Android 的 AlarmManager 進而節省電力

意見回饋

Chrome 團隊想瞭解「通知觸發條件」的使用體驗。

請與我們分享 API 設計

您覺得這個 API 有什麼不如預期的運作方式？或者缺少某些方法需要實現什麼構想？對安全性有任何疑問或意見以及模型請在通知觸發條件 GitHub 存放區中提交規格問題，或將您的想法新增至現有的問題。

無法導入嗎？

您發現 Chrome 實作錯誤嗎？還是採用與規格不同？前往 new.crbug.com 回報錯誤。請務必盡量提供詳細資料重現程式碼的簡單指示，並將元件設為 UI>Notifications。Glitch 上有很棒的表現可讓您輕鬆快速地重現錯誤。

想要使用這個 API 嗎？

打算在網站上使用通知觸發條件嗎？你的公開支援服務有助於我們優先處理以及讓其他瀏覽器廠商瞭解支援它們的重要性。將推文傳送給使用主題標記 @ChromiumDev #NotificationTriggers敬上，並說明你使用這項服務的位置和方式。

實用連結

特別銘謝

通知觸發條件是由 Richard Knoll 實作這段說明文字是由 Peter Beverloo 撰寫。下列使用者已審查文章： Joe Medley、Pete LePage 和 Richard 和 Peter。主頁橫幅製作者： Lukas Blazek 在 Unsplash 上。