删除 webpack offline-plugin 的正确方法是什么？

Question

我被分配到一个项目，他们以前有webpack offline-plugin，现在我们没有了，项目里完全没有必要。

是这样安装的：

new OfflinePlugin({
  updateStrategy: 'changed',
  autoUpdate: 1000 * 60 * 10,
  minify: {
    removeComments: true,
    collapseWhitespace: true,
    removeRedundantAttributes: true,
    useShortDoctype: true,
    removeEmptyAttributes: true,
    removeStyleLinkTypeAttributes: true,
    keepClosingSlash: true,
    minifyJS: true,
    minifyCSS: true,
    minifyURLs: true,
  },
  ServiceWorker: {
    events: true,
    navigateFallbackURL: '/',
  },
})

现在我正在努力删除为生产域中的旧客户创建的服务工作者，那些在删除离线插件之前访问网站的人，最重要的是它看起来像 facebook 每次我尝试再次抓取时，scraper 工具都会获取旧版本，这很重要，因为我已经将新的 SSR 功能部署到生产中。

我已经尝试过的：

webpack-remove-serviceworker-plugin
将以下代码添加到index.html:

if (window.navigator && navigator.serviceWorker) { navigator.serviceWorker.getRegistrations() .then(函数(注册){ 让 registrationsLength = registrations.length; 同时（注册长度--）{ 注册[registrationsLength].unregister(); } }); }
将sw.js替换为以下内容：

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

self.addEventListener('activate',函数(){ self.registration.unregister().then(函数(){ return self.clients.matchAll(); }).then(函数(客户){ clients.forEach((客户端)=>{ 如果（客户端中的client.url && 'navigate'）{ client.navigate(client.url); } }); }); });

None 已经解决了我的问题。在具有另一个域的新服务器上部署项目工作正常。关于这个问题有什么提示或建议吗？

Answer 1

我遇到了同样的问题，您需要将旧的sw.js（通过 OfflinePlugin 生成）替换，其中包含：

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。

Answer 2

我已经成功解决了我的问题，它与

有关

事实证明，该网站已转移到另一个主机，我们还剩下一些 ipv6 AAAA DNS 记录，这些记录优先于新的 ipv4 记录，因此在删除它们之后（加上仍然保留那些用于删除 servce worker 的解决方案）和清除缓存并刷新 2-3 次后，网站运行正常，facebook 抓取问题也得到修复

Answer 3

至于我，我只是用一个新的不存在的范围服务工作者来替换旧的，

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，我添加以下代码以注销旧软件：

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);
      }),
    );
  });
}

经过两口子，几乎每个用户都在chrome中安装了新的sw.js，然后可以禁用离线插件而不影响用户

删除 webpack offline-plugin 的正确方法是什么？

What is the correct way to remove webpack offline-plugin?

offline-caching

webpack

service-worker