客户端

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

Clients 接口提供对Client 对象的访问。在服务工作线程中，通过self.clients访问它。

实例方法

Clients.get(): 返回一个Promise，用于匹配给定id的Client。
Clients.matchAll(): 返回一个Promise，用于包含Client 对象的数组。选项参数允许您控制返回的客户端类型。
Clients.openWindow(): 为给定的 URL 打开一个新的浏览器窗口，并返回一个Promise，用于新的WindowClient。
Clients.claim(): 允许活动的服务工作线程将自身设置为其scope内所有客户端的controller。

示例

以下示例显示了现有的聊天窗口，或者在用户点击通知时创建一个新的聊天窗口。

addEventListener("notificationclick", (event) => {
  event.waitUntil(
    (async () => {
      const allClients = await clients.matchAll({
        includeUncontrolled: true,
      });

      let chatClient;

      // Let's see if we already have a chat window open:
      for (const client of allClients) {
        const url = new URL(client.url);

        if (url.pathname === "/chat/") {
          // Excellent, let's use it!
          client.focus();
          chatClient = client;
          break;
        }
      }

      // If we didn't find an existing chat window,
      // open a new one:
      if (!chatClient) {
        chatClient = await clients.openWindow("/chat/");
      }

      // Message the client:
      chatClient.postMessage("New chat messages!");
    })(),
  );
});

规范

规范
Service Workers # clients-interface

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅

使用 Service Workers