登録を解除するときにサービスワーカーキャッシュをクリアするにはどうすればよいですか？

Question

よく尋ねられる質問How do I uninstall a Service Worker?には、JavaScriptを使用してサービスワーカーの登録を解除するための素晴らしい回答があります。サービスワーカーが登録解除されたときに、どの名前付きキャッシュをクリアするにはどうすればよいですか？

MDN unregisterからサービスワーカーは、登録が解除される前に、実行中の操作をすべて終了します。uninstallイベントをリスンすることは可能なはずですが、そのようなイベントは存在しないようです。as far as I can tellクスクスについては、サービスワーカーにself.addEventListener('uninstall', ...)を追加しようとしましたが、期待どおり、登録解除しても起動しませんでした。私はまた登録を解除して送信される可能性のあるmessageを聞いてみました。

私もservice worker stateを見て考えられませんが、installing、installed、activatingのどれも、activated、およびredundantは、関連する表示されます。言うまでもなく、それはサービスワーカーに渡すメッセージが可能であるようには見えないので、サービスワーカーの外からはuninstalling州でどうしたらよいかわからない。

ストローには、uninstalling flagへの参照がありますが、どこにも公開されていません。提案？

Answer 1

は、すべてのサービスの労働者の登録を解除し、あなたの起源のキャッシュストレージAPIのすべてをクリアする必要があり、次のコード：

async function unregisterAndClearCaches() { 
    const registrations = await navigator.serviceWorker.getRegistrations(); 
    const unregisterPromises = registrations.map(registration => registration.unregister()); 

    const allCaches = await caches.keys(); 
    const cacheDeletionPromises = allCaches.map(cache => caches.delete(cache)); 

    await Promise.all([...unregisterPromises, ...cacheDeletionPromises]); 
} 

Clear-Site-Data headerを使用するには、（サービスワーカー登録をクリアするためにすべてを「強制」のための別のオプションです。 、キャッシュなど）を単一のアクションで実行します。

Answer 2

これは、メッセージパッシングで実行できます。私がJeff Posnickの答えにこれを好む理由の1つは、キャッシュの名前をサービスワーカーの外で知る必要がないということです。サービスワーカーでは、メッセージリスナを追加します。

self.addEventListener('message', (event) => { 
    messageHandler(event); 
}); 

messageHandler()はその後、様々な渡されたメッセージに対してアクションを取ることができます。たとえば：

function messageHandler(event) { 
    if (event.data === 'purge_cache') { 
     caches.delete('mycache') 
     .then((success) => { 
      console.log("Cache removal status: " + success); 
     }) 
     .catch((err) => { 
      console.log("Cache removal error: ", err); 
     }); 
    } 
} 

は、ポストサービス労働者の範囲の下にあるページのスクリプトからのメッセージを、このアクションをトリガーします。だから、キャッシュを削除し、サービス従事者の登録を解除する方法の元の質問のために、あなたはこれを行うことができます：

navigator.serviceWorker.getRegistration() 
.then((registration) => { 
    registration.active.postMessage('purge_cache'); 
    registration.unregister() 
    .then((success) => { 
     console.log('Service worker unregistration status: ' + success); 
    }) 
    .catch((err) => { 
     console.log('Service worker unregistration failed', err); 
    }); 
}) 
.catch((err) => { 
    console.log('Service worker registration not found.'); 
}); 

お知らせは、私がpostMessage('purge_cache')から成功の応答を待機しませんでした。 MDN unregisterから、「サービスワーカーは、登録が解除される前に、進行中の操作を完了します。