I did not think very much about using a rather complicated PWA offline. But now I want to try it. However I am using links like this (inside the PWA so to say):
https://example.com/page.html?param=val
When clicking on a link like that offline in the PWA I get "This site can't be reached". This link however works fine:
https://example.com/page.html
The parameters are all handled in JavaScript in the web browser. What options do I have to handle this? Is the best perhaps to rewrite it as # links? Or do that get me into other troubles?
https://example.com/page.html#param=val
The problem came from the cache. In your sw.js, you give the list of files you want to cache but you give the name of the file without the parameter. Which is logical as in many cases you can't know the full value of the parameters.
So in your case you cache "https://example.com/page.html" but when you call "https://example.com/page.html?param=val" the comparison fail and you get the error message.
The way to solve that is to tell the retreivng function in your sw.js file, to ignore parameter. Rather than
caches.match(event.request)
just use
caches.match(event.request, {ignoreSearch: true})