BackgroundFetchUpdateUIEvent: updateUI() 方法

有限可用性

此功能不是基线功能，因为它在一些最广泛使用的浏览器中不起作用。

实验性： 这是一个 实验性技术
在生产环境中使用之前，请仔细查看 浏览器兼容性表。

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

updateUI() 方法是 BackgroundFetchUpdateUIEvent 接口的一部分，用于更新用户界面中的标题和图标以显示后台提取的状态。

此方法只能运行一次，用于在提取失败或成功时通知用户。

语法

js
updateUI()
updateUI(options)

参数

options 可选

一个包含以下任一内容的对象

icons 可选

一个或多个图像资源列表，包含用于用户界面中的图标。图像资源是一个包含以下内容的对象

src

一个字符串，表示图像的 URL。

sizes 可选

一个字符串，等效于 <link> 元素的 sizes 属性。

type 可选

一个包含图像 MIME 类型的字符串。

label 可选

一个字符串，为关联的图像提供名称。

title 可选

一个包含用户界面新标题的字符串。

返回值

一个 Promise。

异常

InvalidStateError DOMException

如果以下任一情况为真，则抛出此异常

示例

以下示例演示了如何在成功提取时使用标题和图像图标更新 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

浏览器兼容性

BCD 表格仅在浏览器中加载