javascript - 如何清除服务人员的缓存？(How to clear cache of service worker?)

Question

So, I have an HTML page with service worker, the service worker cache the index.html and my JS files.

(因此，我有一个带有服务程序的HTML页面，该服务程序缓存index.html和我的JS文件。)

The problem is when I change the JS, the change doesn't show up directly on the client browser.

(问题是当我更改JS时，更改不会直接显示在客户端浏览器上。)

Of course in chrome dev-tools, I can disable cache.

(当然，在chrome dev-tools中，我可以禁用缓存。)

But in chrome mobile, how do I do that?

(但是在chrome mobile中，我该怎么做？)

I tried to access the site settings and hit the CLEAR % RESET button.

(我试图访问站点设置，然后单击CLEAR％RESET按钮。)

But it still loads the old page/load from cache.

(但是它仍然从缓存加载旧页面/加载。)

I tried to use other browser or chrome incognito and it loads the new page.

(我尝试使用其他浏览器或chrome隐身浏览器，它会加载新页面。)

Then, I try to clear my browsing data (just cache) and it works.

(然后，我尝试清除浏览数据（仅缓存），并且可以正常工作。)

I guess that's not how it should work right?

(我猜那不是应该如何运作的吗？)

my user won't know if the page is updated without clearing the chrome browser cache.

(如果不清除Chrome浏览器缓存，我的用户将不知道页面是否已更新。)

  ask by taek translate from so

Answer 1

If you know the cache name you can simply call caches.delete() from anywhere you like in the worker:

(如果您知道缓存名称，则可以在工作caches.delete()任何位置简单地调用caches.delete() ：)

caches.delete(/*name*/);

And if you wanted to wipe all caches (and not wait for them, say this is a background task) you only need to add this :

(如果您想擦除所有缓存（而不等待它们，说这是一个后台任务），则只需添加以下内容 ：)

caches.keys().then(function(names) {
    for (let name of names)
        caches.delete(name);
});