ServiceWorkerGlobalScope

Experimental

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The ServiceWorkerGlobalScope interface of the ServiceWorker API represents the global execution context of a service worker.

Developers should keep in mind that the ServiceWorker state is not persisted across the termination/restart cycle, so each event handler should assume it's being invoked with a bare, default global state.

Once successfully registered, a service worker can and will be terminated when idle to conserve memory and processor power. An active service worker is automatically restarted to respond to events, such as ServiceWorkerGlobalScope.onfetch (en-US) or ServiceWorkerGlobalScope.onmessage (en-US).

Additionally, synchronous requests are not allowed from within a service worker โ€” only asynchronous requests, like those initiated via the fetch() (en-US) method, can be used.

This interface inherits from the WorkerGlobalScope (en-US) interface, and its parent EventTarget, and therefore implements properties from WindowTimers (en-US), WindowBase64 (en-US), and WindowEventHandlers.

Properties

ServiceWorkerGlobalScope.clients Read only
Contains the Clients object associated with the service worker.
ServiceWorkerGlobalScope.registration (en-US) Read only
Contains the ServiceWorkerRegistration object that represents the service worker's registration.
ServiceWorkerGlobalScope.caches (en-US) Read only
Contains the CacheStorage (en-US) object associated with the service worker.

Events

activate
Occurs when a ServiceWorkerRegistration acquires a new ServiceWorkerRegistration.active worker.
Also available via the ServiceWorkerGlobalScope.onactivate (en-US) property.
fetch
Occurs when a fetch() (en-US) is called.
Also available via the ServiceWorkerGlobalScope.onfetch (en-US) property.
install
Occurs when a ServiceWorkerRegistration acquires a new ServiceWorkerRegistration.installing worker.
Also available via the ServiceWorkerGlobalScope.oninstall (en-US) property.
message
Occurs when incoming messages are received. Controlled pages can use the MessagePort.postMessage() (en-US) method to send messages to service workers. The service worker can optionally send a response back via the MessagePort (en-US) exposed in event.data.port, corresponding to the controlled page.
Also available via the ServiceWorkerGlobalScope.onmessage (en-US) property.
notificationclick
Occurs when a user clicks on a displayed notification.
Also available via the ServiceWorkerGlobalScope.onnotificationclick (en-US) property.
notificationclose
Occurs โ€” when a user closes a displayed notification.
Also available via the ServiceWorkerGlobalScope.onnotificationclose (en-US) property.
push
Occurs when a server push notification is received.
Also available via the ServiceWorkerGlobalScope.onpush (en-US) property.
pushsubscriptionchange
Occurs when a push subscription has been invalidated, or is about to be invalidated (e.g. when a push service sets an expiration time).
Also available via the ServiceWorkerGlobalScope.onpushsubscriptionchange (en-US) property.
sync
Triggered when a call to SyncManager.register (en-US) is made from a service worker client page. The attempt to sync is made either immediately if the network is available or as soon as the network becomes available. 
Also available via the ServiceWorkerGlobalScope.onsync (en-US) property.

Methods

ServiceWorkerGlobalScope.skipWaiting()
Allows the current service worker registration to progress from waiting to active state while service worker clients are using it.

ServiceWorkerGlobalScope implements WorkerGlobalScope (en-US) โ€” which implements WindowOrWorkerGlobalScope (en-US). Therefore it also has the following property available to it:

GlobalFetch.fetch() (en-US)
Starts the process of fetching a resource. This returns a promise that resolves to the Response (en-US) object representing the response to your request. This algorithm is the entry point for the fetch handling handed to the service worker context.

Examples

This code snippet is from the service worker prefetch sample (see prefetch example live.) The ServiceWorkerGlobalScope.onfetch (en-US) event handler listens for the fetch event. When fired, the code returns a promise that resolves to the first matching request in the Cache object. If no match is found, the code fetches a response from the network.

The code also handles exceptions thrown from the fetch() (en-US) operation. Note that an HTTP error response (e.g., 404) will not trigger an exception. It will return a normal response object that has the appropriate error code set.

self.addEventListener('fetch', function(event) {
  console.log('Handling fetch event for', event.request.url);

  event.respondWith(
    caches.match(event.request).then(function(response) {
      if (response) {
        console.log('Found response in cache:', response);

        return response;
      }
      console.log('No response found in cache. About to fetch from network...');

      return fetch(event.request).then(function(response) {
        console.log('Response from network is:', response);

        return response;
      }, function(error) {
        console.error('Fetching failed:', error);

        throw error;
      });
    })
  );
});

Specifications

Specification Status Comment
Service Workers
The definition of 'ServiceWorkerGlobalScope' in that specification.
Working Draft Initial definition

Browser compatibility

BCD tables only load in the browser

See also