title: PWA not working properly with Django using Service Workers
body: <p>I developed a small prototype in django with one model: Profile, and 2 templates with 2 views (a list of profiles, and an edit profile page), with a form in forms.py. I want to test creating a PWA with Django and this is the additional things I did: 1) pip install django-progressive-web-app, 2) added 'pwa' to installed apps, 3) added a render view for the base.html that will be using the service worker!</p>
  
  <pre><code>def base(request):
      return render(request,'app/base.html')
  </code></pre>
  
  <p>4) added it to the urls:</p>
  
  <pre><code>urlpatterns = [
      path(r'', profiles, name="profiles"),
      path('user/&lt;pk&gt;', profile, name="profile"),
      path('', include('pwa.urls')),
  ]
  </code></pre>
  
  <p>5) added this to recognise the service worker:</p>
  
  <pre><code>PWA_SERVICE_WORKER_PATH = os.path.join(BASE_DIR, 'posts/static/js', 'serviceworker.js')
  </code></pre>
  
  <p>6) added the tags:</p>
  
  <pre><code>{% load pwa %}
  
  &lt;head&gt;
      ...
      {% progressive_web_app_meta %}
      ...
  &lt;/head&gt;
  </code></pre>
  
  <p>7) and added this to a serviceworker.js file, situated in the app/static/js:</p>
  
  <pre><code>var staticCacheName = 'djangopwa-v1';
  
  self.addEventListener('install', function(event) {
    event.waitUntil(
      caches.open(staticCacheName).then(function(cache) {
        return cache.addAll([
          '/base_layout'
        ]);
      })
    );
  });
  
  self.addEventListener('fetch', function(event) {
    var requestUrl = new URL(event.request.url);
      if (requestUrl.origin === location.origin) {
        if ((requestUrl.pathname === '/')) {
          event.respondWith(caches.match('/base_layout'));
          return;
        }
      }
      event.respondWith(
        caches.match(event.request).then(function(response) {
          return response || fetch(event.request);
        })
      );
  });
  </code></pre>
  
  <p>What happened is that the service worker is running under Chrome developer tool, but in the django console it displays this error: Not Found: /base_layout, and the homepage is accessible through the Offline mode, but the other path (/user) isn't. And Google Chrome's console displays this error:</p>
  
  <pre><code>The FetchEvent for "http://localhost:8000/manifest.json" resulted in a network error response: the promise was rejected.
  Promise.then (async)
  (anonymous) @ serviceworker.js:19
  serviceworker.js:1 Uncaught (in promise) TypeError: Failed to fetch
  </code></pre>
  
  <p>Also, images are not being loaded.</p>
  
  <p>What did I do wrong?</p>