title: registerRoutes after login - google workbox sw
body: <p>I have a SPA written in vanilla js, which handles routes with prefix - /mail, I want to cache the app shell here and use it for all the child routes like /mail/settings, /mail/inbox... etc,
  This SPA is served by app.html, after login. So I was using this - </p>
  
  <pre><code>//this has to be precached for the below  createHandlerBoundToURL
  workbox.precaching.precacheAndRoute([{
    url:"/mail"
  }
  ])
  
  var pagesRouteHandler = workbox.precaching.createHandlerBoundToURL('/mail');
  //I need this for dynamic url caching,
  var navigationRoutes = new workbox.routing.NavigationRoute(pagesRouteHandler, {
    allowlist: [
      new RegExp('/mail/*'),
    ],
  });
  workbox.routing.registerRoute(navigationRoutes);
  
  </code></pre>
  
  <p>This worked fine when I was registering the service worker after login.(<code>navigator.serviceWorker.register('/sw.js');</code>)</p>
  
  <p>But now, I want to cache the login/signup screens also,which are separate html files, i.e outside SPA. And when I register the service worker in these html files,  The above code tries to precache <code>/mail</code> route, by making a get request. But the response will be a redirect to the login page by the server in the absence of a server session, so the same <code>login.html</code> will be precached as <code>/mail</code> route instead of actual SPA shell(html).</p>
  
  <p>So, I want to register the above /mail and the dynamic routes after login or after /mail route is properly registered(like in a callback of registering <code>/mail</code> route). How do I do this?</p>
  
  <p>Note: I cannot send app.html to <code>/mail</code> (as app shell) from server, without user session, since it is a template rendered with user values.</p>