PWA How to notify the user that he is offline

@bgerstle wrote:

I am using the ionic PWA Service worker. I got it to work nicely with one caveat. I can’t figure out how to notify the user that they are using an offline version and that the data may be stale

I found this post here: https://alligator.io/js/service-workers-sw-toolbox-offline-page/ which shows how to catch instances when the user is offline and to show him an offline page. I tried to produce something similar with the following code

self.toolbox.router.get('/(.*)', function(req, vals, opts) {
  return toolbox.networkFirst(req, vals, opts)
    .catch(function(error) {
      if (req.method === 'GET' && req.headers.get('accept').includes('text/html')) {
        return toolbox.cacheOnly(new Request('/#/offline'), vals, opts);
      }
      throw error;
    });
});

which didn’t work. I also tried:

var url = req.url.replace(/#.*/, '#/offline');
return toolbox.cacheOnly(new Request(url), vals, opts);

which also didn’t work. I don’t need a seperate page I just want to be able to show the user an ionic popup saying that he is offline. Any help is greatly appreciated.
Thanks

Posts: 1

Participants: 1

Read full topic