即使注册成功，服务工作人员也显示为已删除

Question

我似乎无法弄清楚为什么服务工作者会被我注册的代码或实际上是服务工作者的代码删除。

但在此网站中，它在chrome dev工具的“服务工作者”部分显示为已删除（图片如下）。

然而，它也在登录控制台时正确注册（下图中相同）。

以下是服务工作者注册码：

if('serviceWorker' in navigator){

    navigator.serviceWorker.register('/earnie.min.js', { scope: '/'}).then(function(registration){
        console.log('Registration successful, scope is:', registration.scope);
}).catch(function(error){
        console.log('Service worker registration failed, error:', error);
    });
}

这是服务工作者代码：

var cachename="e2",cachelist=";;.;/;./;/privacyPolicy.html;/css/main.css;/css/normalize.css;".split(";");

self.addEventListener("install",function(a){
    a.waitUntil(caches.open(cachename).then(function(a){
        return a.addAll(cachelist)
    }))
});
self.addEventListener("fetch",function(a){
    a.respondWith(caches.match(a.request).then(function(b){
        return b?b:fetch(a.request.clone(), { credentials: 'include', redirect: 'follow' })
    }))
});

是什么导致它被删除而没有注册？

Answer 1

注册成功，但安装实际上失败了。您的waitUntil()承诺未解析，导致InstallEvent事件失败，从而删除了ServiceWorker。运行cachelist

时，split(';')可能会返回无效/空值

我建议确保cachelist是具有有效URI值的数组，然后您可以在安装事件中进行调试**

self.addEventListener("install", event => {
  event.waitUntil(
    caches.open(cachename)
    .then(cache => cache.addAll(cachelist))
    .catch(error => console.error('', error))
  )
})

**您最有可能需要＆＃34;保留日志＆＃34; Chrome开发者工具中启用了控制台选项，以查看控制台错误。