BackgroundFetchUpdateUIEvent: updateUI() 方法

可用性有限

此特性不是基線特性，因為它在一些最廣泛使用的瀏覽器中不起作用。

實驗性： 這是一項實驗性技術
在生產中使用此技術之前，請仔細檢查瀏覽器相容性表格。

注意：此功能僅在 Service Workers 中可用。

BackgroundFetchUpdateUIEvent 介面的 updateUI() 方法更新使用者介面中的標題和圖示，以顯示後臺獲取的狀態。

此方法只能執行一次，用於通知使用者獲取失敗或成功。

語法

js

updateUI()
updateUI(options)

引數

options 可選

包含以下任意內容的 JavaScript 物件。

icons 可選

一個或多個影像資源的列表，包含用於使用者介面中的圖示。影像資源是一個包含以下內容的 JavaScript 物件：

src: 一個字串，表示影像的 URL。
sizes 可選: 一個字串，等同於 <link> 元素的 sizes 屬性。
type 可選: 一個字串，包含影像的 MIME 型別。
label 可選: 一個字串，提供相關聯影像的名稱。

title 可選

一個字串，包含使用者介面的新標題。

返回值

異常

InvalidStateError DOMException

如果出現以下任一情況，則丟擲。

isTrusted 屬性為 false。
BackgroundFetchUpdateUIEvent UI 更新標誌已設定，表明 updateUI() 方法已被呼叫。
BackgroundFetchUpdateUIEvent 未啟用。

示例

以下示例演示了在成功獲取時使用標題和影像圖示更新 UI。

js

addEventListener("backgroundfetchsuccess", (event) => {
  event.updateUI({
    title: "Episode 5 ready to listen!",
    icon: {
      src: "path/to/success.ico",
      sizes: "16x16 32x32 64x64",
    },
  });
});

規範

規範
Background Fetch # background-fetch-update-ui-event-update-ui

瀏覽器相容性

幫助改進 MDN

瞭解如何貢獻

此頁面最後更新於 2025 年 6 月 23 日，由 MDN 貢獻者修改。

在 GitHub 上檢視此頁面 • 報告此內容的問題