ServiceWorkerRegistration: backgroundFetch property

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Note: This feature is available in Web Workers.

The backgroundFetch read-only 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.

js
// 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