demo/service_worker.js
function onFetch(event) {
  // Make sure this is a request we should be handling in the first place.
  // If it's not, it's important to leave it alone and not call respondWith.
  let useCache = false;
  for (const prefix of CACHEABLE_URL_PREFIXES) {
    if (event.request.url.startsWith(prefix)) {
      useCache = true;
      break;
    }
  }

  // Now we need to check our resource lists.  The list of prefixes above won't
  // cover everything that was installed initially, and those things still need
  // to be read from cache.  So we check if this request URL matches one of
  // those lists.
  // The resource lists contain some relative URLs and some absolute URLs.  The
  // check here will only be able to match the absolute ones, but that's enough,
  // because the relative ones are covered by the loop above.
  if (!useCache) {
    if (CRITICAL_RESOURCES.includes(event.request.url) ||
        OPTIONAL_RESOURCES.includes(event.request.url)) {
      useCache = true;
    }
  }

  if (useCache) {
    event.respondWith(fetchCacheableResource(event.request));
  }
}
function onFetch(event) {
  // Make sure this is a request we should be handling in the first place.
  // If it's not, it's important to leave it alone and not call respondWith.
  let useCache = false;
  for (const prefix of CACHEABLE_URL_PREFIXES) {
    if (event.request.url.startsWith(prefix)) {
      useCache = true;
      break;
    }
  }

  // Now we need to check our resource lists.  The list of prefixes above won't
  // cover everything that was installed initially, and those things still need
  // to be read from cache.  So we check if this request URL matches one of
  // those lists.
  // The resource lists contain some relative URLs and some absolute URLs.  The
  // check here will only be able to match the absolute ones, but that's enough,
  // because the relative ones are covered by the loop above.
  if (!useCache) {
    if (CRITICAL_RESOURCES.includes(event.request.url) ||
        OPTIONAL_RESOURCES.includes(event.request.url)) {
      useCache = true;
    }
  }

  if (useCache) {
    event.respondWith(fetchCacheableResource(event.request));
  }
}
function onFetch ( event ) { // Make sure this is a request we should be handling in the first place. // If it's not, it's important to leave it alone and not call respondWith. let useCache = false ; for ( const prefix of CACHEABLE_URL_PREFIXES ) { if ( event . request . url . startsWith ( prefix ) ) { useCache = true ; break ; } } // Now we need to check our resource lists.  The list of prefixes above won't // cover everything that was installed initially, and those things still need // to be read from cache.  So we check if this request URL matches one of // those lists. // The resource lists contain some relative URLs and some absolute URLs.  The // check here will only be able to match the absolute ones, but that's enough, // because the relative ones are covered by the loop above. if ( ! useCache ) { if ( CRITICAL_RESOURCES . includes ( event . request . url ) || OPTIONAL_RESOURCES . includes ( event . request . url ) ) { useCache = true ; } } if ( useCache ) { event . respondWith ( fetchCacheableResource ( event . request ) ) ; } }
This event fires when any resource is fetched.
This is where we can use the cache to respond offline.

@param {!FetchEvent} event
This event fires when any resource is fetched . This is where we can use the cache to respond offline .