ServiceWorkerRegistration: backgroundFetch property

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

The backgroundFetch property of the ServiceWorkerRegistration interface returns a reference to a BackgroundFetchManager object, which can be used to initiate background fetch operations.

Value

A BackgroundFetchManager object.

Examples

Initiating a background fetch

The following code accesses the backgroundFetch property and uses it to initiate a background fetch operation.

// main.js
async function requestBackgroundFetch(movieData) {
  const swRegistration = await navigator.serviceWorker.ready;
  const fetchRegistration = await swRegistration.backgroundFetch.fetch(
    "download-movie",
    ["/my-movie-part-1.webm", "/my-movie-part-2.webm"],
    {
      icons: movieIcons,
      title: "Downloading my movie",
      downloadTotal: 60 * 1024 * 1024,
      label: "Downloading a show",
    }
  );
  //...
}

Specifications

Specification
Background Fetch # dom-serviceworkerregistration-backgroundfetch

Browser compatibility

BCD tables only load in the browser