I have written a progressive web app, following all available guides and examples, but for some reason when I click the Add to homescreen
button, I keep getting this mysterious error:
Site cannot be installed: does not work offline
The major difference between my PWA and the examples, is that mine is running purely in a non-root path of the domain, so I have had to add extra paths to the configs in various places so the app is restricted to the non-root folder.
The Google Lighthouse site doesn't help much either, giving a very similar message.
Can anyone suggest what this error might be caused by?
So it took me a couple of hours, but I eventually figured out that there is a required scope
parameter that you need to specify in the client JavaScript when connecting to the serviceworker, if it's not running on the root (/
) path.
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js?v2', {
scope: '.' // <--- THIS BIT IS REQUIRED
}).then(function(registration) {
// Registration was successful
console.log('ServiceWorker registration successful with scope: ', registration.scope);
}, function(err) {
// registration failed :(
console.log('ServiceWorker registration failed: ', err);
});
}
You can see the working product here:
I hope my pain can save someone else some time.