This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The parameter passed into the oninstall
handler, the InstallEvent
interface represents an install action that is dispatched on the ServiceWorkerGlobalScope
of a ServiceWorker
. As a child of ExtendableEvent
, it ensures that functional events such as FetchEvent
are not dispatched during installation.
This interface inherits from the ExtendableEvent
interface.
InstallEvent.InstallEvent()
InstallEvent
object.Inherits properties from its ancestor, Event
.
InstallEvent.activeWorker
Read only
ServiceWorker
that is currently controlling the page.Inherits methods from its parent, ExtendableEvent
.
This code snippet is from the service worker prefetch sample (see prefetch running live.) The code calls ExtendableEvent.waitUntil()
in ServiceWorkerGlobalScope.oninstall
and delays treating the ServiceWorkerRegistration.installing
worker as installed until the passed promise resolves successfully. The promise resolves when all resources have been fetched and cached, or when any exception occurs.
The code snippet also shows a best practice for versioning caches used by the service worker. Although this example has only one cache, you can use this approach for multiple caches. The code maps a shorthand identifier for a cache to a specific, versioned cache name.
Note: Logging statements are visible in Google Chrome via the "Inspect" interface for the relevant service worker accessed via chrome://serviceworker-internals.
var CACHE_VERSION = 1; var CURRENT_CACHES = { prefetch: 'prefetch-cache-v' + CACHE_VERSION }; self.addEventListener('install', function(event) { var urlsToPrefetch = [ './static/pre_fetched.txt', './static/pre_fetched.html', 'https://www.chromium.org/_/rsrc/1302286216006/config/customLogo.gif' ]; console.log('Handling install event. Resources to pre-fetch:', urlsToPrefetch); event.waitUntil( caches.open(CURRENT_CACHES['prefetch']).then(function(cache) { cache.addAll(urlsToPrefetch.map(function(urlToPrefetch) { return new Request(urlToPrefetch, {mode: 'no-cors'}); })).then(function() { console.log('All resources have been fetched and cached.'); }); }).catch(function(error) { console.error('Pre-fetching failed:', error); }) ); });
Specification | Status | Comment |
---|---|---|
Service Workers | Editor's Draft | As of May 2015, the install event is an instance of ExtendableEvent rather than a child of it. |
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 40 | 44.0 (44.0)[1] | No support | 27 | No support |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|
Basic support | 40 | 40 | 44.0 (44.0) | (Yes) | No support | 27 | No support |
[1] Service workers (and Push) have been disabled in the Firefox 45 and 52 Extended Support Releases (ESR.)
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/InstallEvent