移至 macOS 上的原生通知系統

Paul Lewis

Stephen McGruer

自 Chrome 59 版起，透過 Notifications API 或 chrome.notifications extensions API 傳送的通知，將直接由 macOS 原生通知系統顯示，而非 Chrome 本身的系統。

這項變更可讓 macOS 上的 Chrome 與平台整合得更好，並修正多項長期存在的錯誤，例如 Chrome 不遵循系統「請勿打擾」設定。

以下我們將探討這項變更對現有 API 的影響。

通知中心

這項異動的好處之一，就是通知會顯示在 macOS 的通知中心。

Google Chrome 通知會顯示在 macOS 通知中心

相異處

圖示大小和位置

圖示的外觀將有所變動。它們會變小，並套用邊框間距。建議您改用透明背景圖示，而非純色，以便營造美觀的視覺效果。

Mac 版 Chrome 通知圖示顯示方式 (前) 與 (後)

動作圖示

在這項變更之前，通知會顯示動作按鈕和圖示。使用原生通知時，系統不會使用動作按鈕圖示，使用者必須將滑鼠游標懸停在通知上，然後選取「更多」按鈕，才能查看可用的動作。

通知動作按鈕的圖示前後對照：Chrome 與 macOS 顯示的差異

Chrome 標誌

Chrome 標誌一律會顯示，且無法取代或變更。這是 macOS 上第三方應用程式的要求。

圖片

macOS 將不再支援 image 選項。如果您定義圖片屬性，系統仍會顯示通知，但會忽略圖片參數 (請參閱下方範例)。

macOS 版 Chrome 的通知圖片前後比較

您可以使用以下程式碼支援圖片偵測功能：

if ('image' in Notification.prototype) {  
  // Image is supported.
} else {  
  // Image is NOT supported.
}

Chrome 擴充功能變更

Chrome 擴充功能有通知範本的概念，這項功能會因這項異動而有所不同。

圖片通知範本將不再顯示圖片。請確保圖片是輔助性質，並非使用者必須用來取得資訊。

Chrome.notification API 中圖片範本的「前」與「後」

清單通知範本只會顯示清單中的首個項目。您可以考慮改回基本通知樣式，並使用內文文字來總結一組變更。

chrome.notification API 中清單範本的開頭和結尾

進度通知會在通知標題中附加百分比值，用來表示進度，而非進度列。

Chrome.notification API 中進度範本的「前」與「後」

通知 UI 的最後一個差異是，appIconMarkUrl 將不再用於 macOS。

在 chrome.notification API 中，appIconMarkUrl 的「前」與「後」