Clients.claim

The claim() method of the of the Clients interface allows an active Service Worker to set itself as the active worker for a client page when the worker and the page are in the same scope. This triggers an oncontrollerchange event on any client pages within the Service Worker's scope.

This method can be used with ServiceWorkerGlobalScope.skipWaiting() to ensure that updates to the underlying service worker take effect immediately for both the current client and all other active clients.

Syntax

ServiceWorkerClients.claim().then(function() {
  // Do something
});

Parameters

None.

Returns

A Promise.

Example

The following example uses claim() inside a Service Worker's onActivate event handler so that a client page loaded in the same scope does not need to be reloaded before it can use the Service Worker.

self.addEventListener('install', function(event) {
  event.waitUntil(self.skipWaiting());
});
self.addEventListener('activate', function(event) {
  event.waitUntil(self.clients.claim());
});

Specifications

Specification	Status	Comment
Service Workers The definition of 'Clients' in that specification.	Working Draft	Initial definition. It is still under development (see issue 414 and issue 423).

Browser compatibility

[1] Service workers (and Push) have been disabled in the Firefox 45 Extended Support Release (ESR.)

See also

• Using Service Workers
• Service workers basic code example
• Is ServiceWorker ready?
• Promises
• ServiceWorkerGlobalScope.skipWaiting()
• Using web workers