从根目录删除/serviceworker.js后,Chrome仍然运行我从webroot中删除的serviceworker。我如何从我的网站和Chrome卸载服务工作者,以便我可以登录回我的网站?

我已经将问题追溯到Service Work的缓存机制,现在我只想删除它,直到有时间调试它。我使用的登录脚本重定向到谷歌的服务器,让他们登录到他们的谷歌帐户。但是我从login.php页面得到的只是一条ERR_FAILED消息。


当前回答

打开此页面:chrome://serviceworker-internals,单击“取消注册”按钮。

如果你想注销所有的service worker,打开开发人员工具并在上面的页面上运行这段代码。

document.querySelectorAll("button.unregister").forEach(item=>{ item.click()})

其他回答

打开此页面:chrome://serviceworker-internals,单击“取消注册”按钮。

如果你想注销所有的service worker,打开开发人员工具并在上面的页面上运行这段代码。

document.querySelectorAll("button.unregister").forEach(item=>{ item.click()})

您应该在设备中检测到两个API: getRegistrations和getregiregistration。service-worker并不是在所有平台上都有一组唯一的api。例如,一些浏览器只有navigator.serviceWorker。getregiregistration,没有navigator.serviceWorker.getRegistrations。所以你应该两者都考虑。

如果你的服务人员不让你更新文件。你需要用下面的代码替换serviceworker文件(sw.js / serviceworker .js):

self.addEventListener('install', function(e) {
  self.skipWaiting();
});

self.addEventListener('activate', function(e) {
  self.registration.unregister()
    .then(function() {
      return self.clients.matchAll();
    })
    .then(function(clients) {
      clients.forEach(client => client.navigate(client.url))
    });
});

源在这里

其他答案都添加代码到实时网站,以删除service worker。然而,我不想让这些活代码永远运行,所以我开发了一个解决方案,从service worker本身工作。步骤如下,我在我的博客上发布了更多的细节和解释。

删除注册service worker的代码。 将service worker脚本替换为以下文件。新代码必须从前一个service worker所在的相同URL中可用。如果您过去有多个service worker url,您应该在所有这些url上复制代码。

console.log("Cleanup Service Worker Starting");

caches.keys()
    .then(keys =>
        Promise.all(
            keys.map(async key => console.log("caches.delete", key, await caches.delete(key)))))
    .then(async () => {
        console.log("registration.unregister", await registration.unregister());
    })
    .then(() => console.log("DONE"))
    .catch(console.error);

这段代码相当直截了当。首先它删除所有缓存,然后注销自己。

用户的浏览器会在下次加载你的网站时自动检查更新的service worker,或者在最后一次service worker检查后24小时内自动检查下一个事件。这意味着现有用户将在下次访问时运行此清理。

对我来说,我只是用一个新的不存在的scope service worker来代替旧的scope service worker,

ServiceWorker: {
        events: true,
        // what range of URLs a service worker can control. Use a nonexistent path to disable ServiceWorker
        scope: '/disable-service-worker/',
      },

对于app.js,我添加了以下代码来注销旧的sw:

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.getRegistrations().then(registrations => {
    for (const registration of registrations) {
      // keep only serviceWorker which scope is /disable-service-worker/, The purpose is to make serviceWorker useless
      if (registration.scope.includes('/disable-service-worker/') === false) {
        registration.unregister()
      }
    }
  });
  // clear cache of service worker
  caches.keys().then(keyList => {
    return Promise.all(
      keyList.map(key => {
        return caches.delete(key);
      }),
    );
  });
}