macOS 網頁應用程式的原生通知歸因

Marijn Kruisselbrink
Marijn Kruisselbrink
LinkedIn
Dan Murphy
Dan Murphy
X LinkedIn

發布日期：2026 年 7 月 16 日

從 Chrome 152 版開始，在 macOS 上安裝的漸進式網頁應用程式 (PWA) 會將通知歸給 PWA 本身，而不是 Google Chrome。

這項重大改善可提升使用者體驗，讓網頁應用程式更融入 macOS。不過，這個版本也對通知權限的處理方式，以及特定通知 API 的行為進行了重大變更。

異動內容

先前，PWA 傳送的所有通知都會在 OS 層級歸給 Chrome。在 macOS 通知中心，這些通知會顯示在「Google Chrome」下方，並使用 Chrome 圖示。如要停用通知，使用者必須使用 Chrome 內的控制選項，而非 macOS 系統設定。

透過通知歸因，當網站安裝為 PWA 時，macOS 會將其視為獨立的通知應用程式。這項功能適用於新安裝的 PWA，以及使用者先前安裝的 PWA。

優點：

  • 品牌識別資訊：通知會在 macOS 通知中心和橫幅中顯示 PWA 的名稱和圖示。
  • 使用者熟悉的控制項：這些應用程式的通知控制項現在會顯示在使用者預期的地方，也就是 macOS 系統設定 (而非 Chrome)。
  • 精細控管：使用者可以管理個別 PWA 應用程式的通知設定 (例如快訊樣式、螢幕鎖定畫面行為)。
  • 專注模式：在 macOS 專注模式設定檔 (零打擾) 中，可以個別允許或禁止 PWA 發出通知。
歸因於「Google Chrome」，並附上 Chrome 圖示。
變更前：歸因於「Google Chrome」，並顯示 Chrome 圖示。
歸因於「PWA 名稱」，並顯示 PWA 的自訂圖示。
變更後：歸因於「PWA 名稱」，並顯示 PWA 的自訂圖示。

新的權限流程

由於 macOS 現在會將 PWA 視為獨立應用程式，因此 PWA 必須先取得作業系統層級的通知權限，才能顯示通知。這會變更新使用者和現有使用者的權限流程。

新使用者 (首次要求權限)

如果使用者安裝 PWA，且網站在安裝後要求通知權限：

  1. Chrome 會略過瀏覽器層級的權限提示 (網址列的下拉式選單)。
  2. Chrome 會立即觸發 PWA 的 macOS 系統權限提示。
macOS 系統權限對話方塊：「PWA 名稱」想要傳送通知給您。通知可能包括快訊、音效和圖示標記，並提供「不允許」和「允許」按鈕。
已安裝 PWA 的 macOS 系統權限對話方塊。
流程圖：顯示 PWA 權限程序。開頭為「PWA Requests Permission」，會導向「Installed?」的決策。如果選取「是」，系統會略過 Chrome 提示，並顯示 macOS 系統提示。如果選取「否」，系統會顯示 Chrome 瀏覽器提示，使用者安裝 PWA 後，系統會顯示 macOS 系統提示。
PWA 通知權限流程的流程圖。

現有使用者 (遷移路徑)

如果使用者已在 Chrome 中授予網站通知權限， 然後安裝 (或已安裝) PWA，他們仍須授予 PWA 作業系統層級的權限。

為確保轉換過程順利，請按照下列步驟操作：

  1. PWA 首次嘗試傳送通知時，macOS 會顯示系統權限提示。
  2. 如果使用者核准，通知功能就會繼續順暢運作。
  3. 如果使用者忽略或關閉這項提示，PWA 會顯示應用程式內指標 (通常位於應用程式的標題列或選單)，引導使用者前往 macOS 系統設定，手動啟用權限。
提示已安裝的 PWA，告知使用者 Mac 系統設定已關閉通知，並提供前往該處的按鈕。
在漸進式網頁應用程式中顯示提示，引導使用者前往 macOS 系統設定。
應用程式設定，可開啟或關閉通知，以及指向「系統設定」的指標，可啟用通知。
Chrome 中的應用程式設定，附有開啟 macOS 系統設定的指標。
在瀏覽器中顯示提示，告知使用者 Mac 系統設定已關閉這個應用程式的通知，並提供前往該處的按鈕。
瀏覽器內提示，引導使用者前往 macOS 系統設定。

對開發人員的影響：macOS 上的 requireInteraction 已淘汰

在 macOS 中，通知會保留在畫面上直到使用者關閉 (「持續」)，還是會自動消失 (「暫時」)，取決於 macOS 系統設定中使用者控制的應用程式設定。

由於這項作業系統設計，當啟用出處時，Chrome 將不再遵守 macOS 通知 API 中的 requireInteraction 選項。

這對程式碼的影響：

如果您的應用程式依賴 requireInteraction: true 將重要通知顯示在畫面上，macOS 將不再提供這項保證。建議您改採下列做法：

  • 設計應用程式時，請假設通知可能會是暫時性 (臨時)。
  • 如果使用者需要持續顯示通知，請鼓勵他們在 System Settings > Notifications > [Your PWA] 中將 PWA 的通知快訊樣式設為「Persistent」。
macOS 系統設定，醒目顯示「快訊類型」設定，顯示「暫時」和「永久」。
macOS 系統設定，顯示漸進式網頁應用程式的「提醒樣式」設定 (「暫時」與「持續」)。

開發人員影響：App Badging API 需要通知權限

應用程式徽章 API 可讓網頁應用程式在應用程式圖示上設定徽章 (例如顯示未讀訊息數量)。在 macOS 上，應用程式圖示徽章在技術上與應用程式的通知設定相關聯。因為 PWA 現在有自己的原生通知身分：

  • 必要權限：PWA 必須啟用作業系統層級的通知權限，才能在 Dock 圖示上顯示徽章。這項做法符合 macOS 平台標準，且與 Safari 目前處理網頁應用程式 Badging API 的方式一致。
  • 無聲失敗：如果使用者在 System Settings > Notifications > [Your PWA] 中停用「顯示應用程式圖示上的標記」，或完全拒絕通知權限，對 navigator.setAppBadge() 的呼叫仍會在 JavaScript 中成功 (不會擲回錯誤)，但 Dock 上不會顯示徽章。如果應用程式會顯示徽章，請務必要求通知權限，確保徽章能正常顯示。

對企業管理員的影響

如果您是企業管理員，負責管理 macOS 裝置，且想預先授予通知權限，請按照下列步驟操作：

  1. Chrome 政策：您仍須設定 Chrome 政策 (NotificationsAllowedForUrls)，才能授予 PWA 來源權限。
  2. macOS 政策：此外，您現在必須部署 macOS 設定檔 (MDM)，預先授予 PWA 套件 ID (應用程式墊片) 通知權限。

如果沒有這兩項政策，系統仍會在 OS 層級提示使用者。

開發人員最佳做法

  1. 檢查權限狀態：請務必在傳送通知前檢查 Notification.permission。
  2. 情境式提示：如果系統偵測到網頁層級已授予權限，但通知未顯示 (可能是因為作業系統層級的權限已遭撤銷)，請引導使用者前往 macOS 系統設定。
  3. 準備接收暫時性通知：請勿在 macOS 上依賴 requireInteraction 執行重要的使用者流程。