注销后停用服务人员答案

【问题标题】：Deactivate service worker after unregister注销后停用服务人员
【发布时间】：2021-08-19 19:36:49
【问题描述】：

对于我正在处理的项目，我实现了一个服务工作者，它在将 testMode=true 放入 url 后激活。但是我注意到一旦从 url 中删除了 testMode=true，service worker 仍然处于活动状态并且被使用，这不是我想要的。

这是它注册的页面：

class TestMode {
    public init(): void {
        const baseUrl = hosts.getHost(HostNames.Planner);
        const countryCode = localeService.getLocale();

    if (!this.isEnabled()) {
        navigator.serviceWorker.getRegistrations().then(function (registrations) {
            for(const registration of registrations) {

                if (registration?.active?.scriptURL === `${baseUrl}/worker.${countryCode}.min.js`) {
                    registration.unregister().then()
                    {
                        registration.update();
                    }
                }
            }
        })

        return;
    }

    if (!('serviceWorker' in navigator)) {
        debug.log(__filename, 'Browser does not support service workers');
        return;
    }

    navigator.serviceWorker
        .register(`${baseUrl}/worker.${countryCode}.min.js`)
        .then(this.handleRegistration)
        .catch((error) => {
            throw new Error('Service Worker registration failed: ' + error.message);
        });
}

private handleRegistration(registration: ServiceWorkerRegistration): void {
    registration.update();

    debug.log(__filename, 'Registration successful, scope is: ' + registration.scope);
}

public isEnabled(): boolean {
    return locationService.hasParam('testMode');
}
}

export const testMode = new TestMode();

现在我试图做的就是像这样简单地取消注册：

    if (!this.isEnabled()) {
        navigator.serviceWorker.getRegistrations().then(function (registrations) {
            for(const registration of registrations) {

                if (registration?.active?.scriptURL === `${baseUrl}/worker.${countryCode}.min.js`) {
                    registration.unregister().then()
                    {
                        registration.update();
                    }
                }
            }
        })

        return;
    }

这确实会取消注册，但在我再次刷新页面之前服务人员仍然处于活动状态，有没有办法在取消注册后直接停用而无需刷新页面？

【问题讨论】：

标签： javascript typescript service-worker

【解决方案1】：

我添加了 window.location.reload 所以它现在看起来像这样：

if (!this.isEnabled()) {
    navigator.serviceWorker.getRegistrations().then(function (registrations) {
        for (const registration of registrations) {
            if (registration?.active?.scriptURL === `${baseUrl}/worker.${countryCode}.min.js`) {
                registration.unregister();
                window.location.reload();
            }
        }
    });

    return;
}

这实际上对我来说似乎很有效

【讨论】：