Background Fetch. Step 2: Storing the data received

index.html

<script>
  
  bgFetchButton.addEventListener('click', async event => {
      try {
        event.target.disabled = true;
        const registration = await navigator.serviceWorker.ready;

        registration.backgroundFetch.fetch('my-fetch', [
          '/assets/s01e01.mpg',
          '/assets/s01e02.mpg'
        ]);
      } catch (err) {
        alert(
          'Please enable downloads for this website (click the icon on the right side of the address bar)'
        );
        console.error(err);
      }
    });
  
  </script>

service-worker.js

addEventListener('backgroundfetchsuccess', event => {
  console.log('[Service Worker]: Background Fetch Success', event.registration);
  event.waitUntil(
    (async function() {
      try {
        const cache = await caches.open(event.registration.id);
        const records = await event.registration.matchAll();
        const promises = records.map(async record => {
          const response = await record.responseReady;
          await cache.put(record.request, response);
        });
        await Promise.all(promises);
      } catch (err) {
        console.error(err)
      }
    })()
  );
});