Can someone help with the implementation of offline fallback page for POST request or routing requests which fails in Angular PWA? I have created the scripts for loading fallback page inside a custom service worker file, where i listen to the fetch request and check if it is a get request and has destination as document, then serve the offline page from cache. This is working fine. But i need this to work in case if it is a post request which fails to fetch from cache or network. I couldn't find any code for the same. When i tried using the same code for post as well, it is reaching the offline page script, but again it is going to the original service worker and listens to the fetch and its failing. Basically only navigation request works for that script. And not even the router navigation. I shall share the code snippet below. Please assume that i am adding offline page to cache before hand and it works fine in this case.
self.addEventListener('fetch', function (event) {
const request = event.request;
// filter for html document fetches (should only result in one single fetch) --> index.html
if (request.method === "GET" && request.destination === "document") {
// only intercept if there was a problem fetching index.html
event.respondWith(
fetch(request).catch(function (error) {
console.error("[onfetch] Failed. Serving cached offline fallback", error);
// return offline page from cache instead
return caches.match("offline.html");
}));
} });
// use all the magic of the Angular Service Worker
importScripts('./ngsw-worker.js');