ServiceWorkerGlobalScope: backgroundfetchabort event

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

The backgroundfetchabort event of the ServiceWorkerGlobalScope interface is fired when the user or the app itself cancels a background fetch operation.

This event is not cancelable and does not bubble.

Syntax

Use the event name in methods like addEventListener(), or set an event handler property.

js

addEventListener("backgroundfetchabort", (event) => {});

onbackgroundfetchabort = (event) => {};

Event type

Event properties

Inherits properties from its parent, ExtendableEvent.

BackgroundFetchEvent.registration

Returns the BackgroundFetchRegistration for the aborted fetch.

Description

In the background fetch API, the browser shows a UI element to the user to indicate the progress of the operation. This element also enables the user to cancel the fetch. The app itself can also cancel the fetch by calling BackgroundFetchRegistration.abort().

If the fetch is canceled, the browser aborts the fetch, starts the service worker, if necessary, and fires the backgroundfetchabort event in the service worker's global scope.

In the handler for this event, the service worker can clean up any related data for the operation. It can also retrieve and store any successful responses (for example, using the Cache API). To access the response data, the service worker uses the event's registration property.

Examples

Cleaning up

This event handler might perform any cleanup of data associated with the aborted fetch.

js

addEventListener("backgroundfetchabort", (event) => {
  // clean up any related data
});

Specifications

Specification
Background Fetch
# dom-serviceworkerglobalscope-onbackgroundfetchabort

Browser compatibility

BCD tables only load in the browser

See also