Html 如何卸载 Service Worker？

How do I uninstall a Service Worker?

提问by Mark Tomlin

After deleting /serviceworker.jsfrom my root directory, Chrome still runs the service worker that I removed from my webroot. How do I uninstall the service worker from my website and Chrome so I can log back into my website?

/serviceworker.js从我的根目录中删除后，Chrome 仍然运行我从 webroot 中删除的 service worker。如何从我的网站和 Chrome 中卸载 Service Worker，以便我可以重新登录我的网站？

I've tracked the issue down to Service Work's cache mechanism and I just want to remove for now until I have time to debug it. The login script that I'm using redirects to Google's servers for them to login to their Google account. But all I get from the login.php page is an ERR_FAILEDmessage.

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

回答by Daniel Herr

You can remove service workers programmatically like this:

您可以像这样以编程方式删除服务工作者：

navigator.serviceWorker.getRegistrations().then(function(registrations) {
 for(let registration of registrations) {
  registration.unregister()
} })

Docs: getRegistrations, unregister

文档：getRegistrations，取消注册

You can also remove service workers under the Application tab in Chrome Devtools.

您还可以在 Chrome Devtools 的“应用程序”选项卡下删除 Service Worker。

回答by k00k

You can also go to the URL: chrome://serviceworker-internals/and unregister a serviceworker from there.

您还可以转到 URL：chrome://serviceworker-internals/并从那里取消注册 serviceworker。

回答by Sakshi Nagpal

You can do this through Chrome Developer Toolas well as Programatically.

您可以通过Chrome Developer Tool以及以编程方式执行此操作。

1. Find all running instance or service worker by typing

   chrome://serviceworker-internals/

   in a new tab and then select the serviceworker you want to unregister.

2. Open Developer Tools (F12) and Select Application. Then Either

   Select Clear Storage -> Unregister service worker

   or

   Select Service Workers -> Choose Update on Reload

3. Programatically

1. 通过键入查找所有正在运行的实例或服务工作者

   铬：//serviceworker-internals/

   在新选项卡中，然后选择要取消注册的 serviceworker。

2. 打开开发人员工具 (F12) 并选择应用程序。那么要么

   选择清除存储 -> 取消注册服务工作者

   或者

   选择 Service Workers -> 选择 Update on Reload

3. 以编程方式

if(window.navigator && navigator.serviceWorker) {
  navigator.serviceWorker.getRegistrations()
  .then(function(registrations) {
    for(let registration of registrations) {
      registration.unregister();
    }
  });
}

回答by Asim K T

In Google Chrome, you can go to Developer tools (F12) -> Application -> Service workerand unregisterthe service workers from the list for that specific domain.

在 Google Chrome 中，您可以转到开发人员工具 (F12) -> 应用程序 -> 服务工作者并从该特定域的列表中取消注册服务工作者。

This method is effective in development mode of a site and mostly they run on localhostwhich is you may need for other project's development.

这种方法在一个站点的开发模式下是有效的，并且大多数它们运行在localhost您可能需要其他项目开发的地方。

回答by GuoX

You should detecte two API in your devices: getRegistrationsand getRegistration. The service-worker not has a unique set of APIs in all platforms. For example, some browsers only have a navigator.serviceWorker.getRegistration, no navigator.serviceWorker.getRegistrations. So you should consider with both.

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

回答by Francesco

In addition to the already correct answers given, if you want also to delete the SW cache you can use:

除了已经给出的正确答案之外，如果您还想删除 SW 缓存，您可以使用：

if ('caches' in window) {
    caches.keys()
      .then(function(keyList) {
          return Promise.all(keyList.map(function(key) {
              return caches.delete(key);
          }));
      })
}

You can read more here(Paragraph: "Unregister a service worker")

你可以在这里阅读更多（段落：“取消注册服务工作者”）

Or via Browser accessing the "Cache Storage" section and click on the "Clear Site Data" button:

或者通过浏览器访问“缓存存储”部分并单击“清除站点数据”按钮：

回答by terrymorse

FYI, in case you are using MacOS Safaribrowser, there is one way to forcibly unregister a service worker (steps and images for Safari 12.1):

仅供参考，如果您使用的是 MacOS Safari浏览器，有一种方法可以强制注销 Service Worker（Safari 12.1 的步骤和图像）：

1. Safari > Preferences... > Privacy > Manage Website Data…

2. Enter domain name (ex. 'localhost'), click "Remove"

1. Safari > 首选项... > 隐私 > 管理网站数据...

2. 输入域名（例如'localhost'），点击“删除”

Note:In addition to service workers, this also will erase all caches, cookies, and databases for this domain.

注意：除了 Service Worker 之外，这还将清除此域的所有缓存、cookie 和数据库。

回答by Pankaj Rupapara

safely uninstall Service Worker

安全卸载 Service Worker

if ('serviceWorker' in navigator) {
      navigator.serviceWorker.getRegistrations().then(function (registrations) {
        for (const registration of registrations) {
          // unregister service worker
          console.log('serviceWorker unregistered');
          registration.unregister();
        }
      });
    }

回答by Vital

to detect service worker:

检测服务工作者：

navigator.serviceWorker.controller

Code to for deletion of service worker:

用于删除 Service Worker 的代码：

navigator.serviceWorker.getRegistrations()
  .then(registrations => {
    registrations.forEach(registration => {
      registration.unregister();
    })
  });

  navigator.serviceWorker.getRegistrations().then(function(registrations) {
   for(let registration of registrations) {
    registration.unregister()
  } })

  if(window.navigator && navigator.serviceWorker) {
    navigator.serviceWorker.getRegistrations()
    .then(function(registrations) {
      for(let registration of registrations) {
        registration.unregister();
      }
    });
  }

  if ('caches' in window) {
      caches.keys()
        .then(function(keyList) {
            return Promise.all(keyList.map(function(key) {
                return caches.delete(key);
            }));
        })
  }

  if ('serviceWorker' in navigator) {
        navigator.serviceWorker.getRegistrations().then(function (registrations) {
          for (const registration of registrations) {
            // unregister service worker
            console.log('serviceWorker unregistered');
            registration.unregister();

            setTimeout(function(){
              console.log('trying redirect do');
              window.location.replace(window.location.href); // because without redirecting, first time on page load: still service worker will be available
            }, 3000);
          }
        });
      }