title: Uncaught (in promise) TypeError: Request failed pwa error
body: <p>I am trying to build a Progressive Web App (PWA).</p>
  
  <p>The service worker shows registered, PWA audit shows everything good, 
  but the console shows this error:</p>
  
  <blockquote>
    <p>TypeError: Request failed pwa error</p>
  </blockquote>
  
  <p>I am unable to cache the files. </p>
  
  <p>I tried all possible answers on Stack Overflow and it's the  same </p>
  
  <pre><code>//self.addEventListener('fetch', function(event) {});
  
  
  var dataCacheName = 'myappData-v3n';
  var cacheName = 'myapp-3n';
  var filesToCache = [
  
  
    'images/logo.png',
    'js/jquery.min.js',
    'js/popper.min.js',
    'js/bootstrap.min.js',
    'js/main.js',
    'css/bootstrap.min.css',
    'css/fontawesome-all.min.css',
    'css/style.css',
    'css/style.css',
    'index.html'
  
  ];
  
  /*self.addEventListener('install', function(e) {
    console.log('[ServiceWorker] Install');
    e.waitUntil(
      caches.open(cacheName).then(function(cache) {
        console.log('[ServiceWorker] Caching app shell');
        return cache.addAll(filesToCache);
      })
    );
  });*/
  self.addEventListener('install', function(event) {
  
  console.log('Handling install event. Resources to pre-fetch:', filesToCache);
  
    event.waitUntil(
      caches.open(cacheName).then(function(cache) {
        cache.addAll(filesToCache.map(function(filesToCache) {
          return new Request(filesToCache, {mode: 'no-cors'});
        }))
      }).then(function() {
          console.log('All resources have been fetched and cached.');
        }).catch(function(error) {
        console.error('Pre-fetching failed:', error);
      })
    );
  });
  
  /*async function doSomething(cache) {
    cache.addAll(filesToCache.map(function(filesToCache) {
          return new Request(filesToCache, {mode: 'no-cors'});
        //console.log('All resources have been fetched and cached.');
  }));
  }*/
  
  self.addEventListener('activate', function(e) {
    console.log('[ServiceWorker] Activate');
    e.waitUntil(
      caches.keys().then(function(keyList) {
        return Promise.all(keyList.map(function(key) {
          if (key !== cacheName &amp;&amp; key !== dataCacheName) {
            console.log('[ServiceWorker] Removing old cache', key);
            return caches.delete(key);
          }
        }));
      })
    );
    return self.clients.claim();
  });
  
  
  
  
  
  
  
  
  
  self.addEventListener('fetch', function(event) {
    console.log('Fetch event for ', event.request.url);
    event.respondWith(
      caches.match(event.request).then(function(response) {
        if (response) {
          console.log('Found ', event.request.url, ' in cache');
          return response;
        }
        console.log('Network request for ', event.request.url);
        return fetch(event.request)
  
      }).catch(function(error) {
  
  
  
        return caches.match('index.html');
  
  
      })
    );
  });`
  </code></pre>
  
  <p>I also tried changing the cache urls to "." "./" "/" </p>
  
  <p>I tried in the root url and folder too .
  Tried to change everything but didnt worked out. </p>
  
  <p>Unable to cache urls.</p>
  
  <p>Need help.</p>