Clients

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2018.

Hinweis: Diese Funktion ist nur in Service Workers verfügbar.

Das Clients-Interface bietet Zugriff auf Client-Objekte. Sie können darauf über [self](/de/docs/Web/API/ServiceWorkerGlobalScope).clients in einem Service Worker zugreifen.

Instanzmethoden

Clients.get()

Gibt ein Promise für einen Client zurück, der einer gegebenen id entspricht.

Clients.matchAll()

Gibt ein Promise für ein Array von Client-Objekten zurück. Ein Optionsargument ermöglicht es Ihnen, die zurückgegebenen Client-Typen zu kontrollieren.

Clients.openWindow()

Öffnet ein neues Browserfenster für eine gegebene URL und gibt ein Promise für den neuen WindowClient zurück.

Clients.claim()

Ermöglicht einem aktiven Service Worker, sich als controller für alle Clients innerhalb seines scope zu setzen.

Beispiele

Das folgende Beispiel zeigt ein bestehendes Chatfenster oder erstellt ein neues, wenn der Benutzer auf eine Benachrichtigung klickt.

js
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!");
    })(),
  );
});

Spezifikationen

Specification
Service Workers
# clients-interface

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch