The Clients
interface provides access to Client
objects. Access it via
within a service worker.self
.clients
Methods
Clients.get()
- Returns a
Promise
for aClient
matching a givenid
. Clients.matchAll()
- Returns a
Promise
for an array ofClient
objects. An options argument allows you to control the types of clients returned. Clients.openWindow()
- Opens a new browser window for a given url and returns a
Promise
for the newWindowClient
. Clients.claim()
- Allows an active service worker to set itself as the
controller
for all clients within itsscope
.
Examples
The following example shows an existing chat window or creates a new one when the user clicks a notification.
addEventListener('notificationclick', event => { event.waitUntil(async function() { 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!"); }()); });
Specifications
Specification | Status | Comment |
---|---|---|
Service Workers The definition of 'Clients' in that specification. |
Working Draft | Initial definition |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Clients | Chrome Full support 40 | Edge Full support ≤79 | Firefox
Full support
44
| IE No support No | Opera Full support 27 | Safari No support No | WebView Android Full support 40 | Chrome Android Full support 40 | Firefox Android Full support 44 | Opera Android Full support 27 | Safari iOS No support No | Samsung Internet Android Full support 4.0 |
claim | Chrome Full support 42 | Edge Full support ≤79 | Firefox
Full support
44
| IE No support No | Opera Full support 29 | Safari No support No | WebView Android Full support 42 | Chrome Android Full support 42 | Firefox Android Full support 44 | Opera Android Full support 29 | Safari iOS No support No | Samsung Internet Android Full support 4.0 |
get | Chrome Full support 51 | Edge Full support ≤79 | Firefox
Full support
45
| IE No support No | Opera Full support 38 | Safari No support No | WebView Android No support No | Chrome Android Full support 51 | Firefox Android Full support 45 | Opera Android Full support 41 | Safari iOS No support No | Samsung Internet Android Full support 5.0 |
matchAll | Chrome
Full support
47
| Edge
Full support
≤79
| Firefox
Full support
44
| IE No support No | Opera Full support 32 | Safari No support No | WebView Android
Full support
47
| Chrome Android
Full support
47
| Firefox Android
Full support
44
| Opera Android Full support 32 | Safari iOS No support No | Samsung Internet Android
Full support
4.0
|
openWindow | Chrome
Full support
40
| Edge
Full support
≤79
| Firefox
Full support
45
| IE No support No | Opera Full support 38 | Safari No support No | WebView Android
Full support
40
| Chrome Android
Full support
40
| Firefox Android Full support 45 | Opera Android Full support 41 | Safari iOS No support No | Samsung Internet Android
Full support
4.0
|
Legend
- Full support
- Full support
- No support
- No support
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.
- See implementation notes.
- See implementation notes.