服务工作者需要双重刷新

我很难让我的服务人员做我想做的事,这就是:

• 提供网站离线验证
• 更新内容时刷新内容

它目前所做的是好的,除了每当我改变我的网页内容,我需要刷新两次,然后我看到的变化。我该怎么做才能保持脱机回退,但只刷新一次页面就获得新内容?

const version = "0.6.25";
const cacheName = `cache-${version}`;
self.addEventListener('install', e => {
    e.waitUntil(
        caches.open(cacheName).then(cache => {
            return cache.addAll([
                `/`,
                `/index.html`,
                '/1.jpg',
            ])
                .then(() => self.skipWaiting());
        })
    );
});

self.addEventListener('fetch', (event) => {
    event.respondWith(async function() {
        const cache = await caches.open(cacheName);
        const cachedResponse = await cache.match(event.request);
        const networkResponsePromise = fetch(event.request);

        event.waitUntil(async function() {
            const networkResponse = await networkResponsePromise;
            await cache.put(event.request, networkResponse.clone());
        }());

        // Returned the cached response if we have one, otherwise return the network response.
        return cachedResponse || networkResponsePromise;
    }());
});

我试着换了 cachedResponse 具有 networkResponsePromise 在最后一行,但我失去了离线回退。