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 上查看此页面 • 报告此内容的问题