کار نکردن روش Network first , falling back to cache

با سلام. 

من در پروژه ام میخواستم از روش  Network first , falling back to cache استفاده کنم حالت انلاین جواب میده ولی حالت آفلاین که میذاریم هر دو حالت زیر کار نمیکنه : 

1 . در کش موجود هست و کش باید فرواخوانی بشه ..

2. در کش موجود نیست و باید صفحه errOffline را نمایش بده..

این دو حالت را هر کاری کردم جواب نداده ممنون میشه یه نگاهی به کد نوشته شده بندازید..

با تشکر

self.addEventListener("fetch", (event) => {
    console.log('[SW] fetching ...');
    const request = event.request;

   


    // 4 Network first , falling back to cache
    event.respondWith(
        fetch(request)
            .then((res) => {
                caches.open(DYNAMIC_CACHE_VERSION)
                    .then((cache) => {
                                cache.put(request, res);
                            });
                return res.clone();
            })
            .catch((err) => {
                console.log('[SW] fetch Network error');

                caches.match(request)
                    .then((response) => {
                        return response;
                    })
                    .catch((err) => {
                        console.log('[SW] cache fetch error');
                        return caches.open(STATIC_CACHE_VERSION)
                            .then(function (cache) {
                                console.log("err not found ... ");
                                if (request.headers.get('accept').includes('text/html')) {
                                    return cache.match('/Home/errOffline');
                                }
                                if (request.url.match(/\.(jpe?g|png|gif|svg)$/)) {
                                    return cache.match('/images/notfound.png');
                                }
                                console.log('[SW] cache fetch open not found');
                            });
                    })
            })
    );
});