3

不确定这是潜在的错误还是我做错了什么。

我正在使用基于 cli 的应用程序,@angular/serviceworker 5.1.0 @angular/cli 1.6.0 软件的实现完全由

我将尝试描述发生了什么:

考虑一个正在运行 Service Worker 的应用程序。SW 缓存来自 的数据ngsw.json

现在,我将ng build --prod使用新的 budle 哈希部署一个新文件。

当前运行的应用程序的 ServiceWorker 将加载旧的缓存文件,除非明确要求通过SwUpdate服务进行更新。没关系。

但事情就是这样。打开新选项卡并加载应用程序的新实例后,它仍会加载旧文件。在网络日志中没有获取 new ngsw.json

两个选项卡是否使用相同的 ServiceWorker?

ServiceWorker 如何知道何时检查 new ngsw.json

最奇怪的事情:有时按下 F5 后,ServiceWorker 仍在加载旧文件。有时它会加载新文件。有时它会尝试使用旧哈希获取文件并失败(404)!

到目前为止,我还没有弄清楚任何模式。

浏览器缓存是否可能导致问题?我尝试将服务器响应标头添加到no-cache并过期:0 但没有区别。

4

1 回答 1

1

在给出这个答案时,最新版本的 ngsw (@angular/service-worker) 是 8.2.13。

两个选项卡是否使用相同的 ServiceWorker?

是的,两个选项卡都激活了同一个服务人员。这样做是因为数据完整性,如果您让一个服务工作者在不同选项卡上与另一个服务工作者进行不同的处理,这将成为维护的噩梦。

ServiceWorker 如何知道何时检查新的 ngsw.json?

ngsw.json 会在您调用生产构建时更新,正如您所确定的:ng build --prod. Service Worker 不会将 ngsw.json 的更新视为对 Service Worker 的更新。因此,它可以在不创建新版本的 service worker 的情况下更新 service worker 的缓存,并且简单的刷新就足够了,而无需关闭浏览器选项卡。

如果 Service Worker 更新了,应该安装一个新的 Service Worker, 但它不会激活,直到所有关联的浏览器客户端(选项卡)都已关闭,这将确保更新安全。

有时在按下 F5 时,ServiceWorker 仍在加载旧文件。有时它会加载新文件。有时它会尝试使用旧哈希获取文件并失败(404)!

当涉及到服务人员时,刷新按钮的行为并不正常。如果您正在执行硬重新加载,您将绕过 service worker 并请求新数据。此操作不一定会更新 service worker 的缓存。结果,您可能会发现下一次刷新会加载旧数据,这些数据是从与旧服务工作者关联的缓存中检索的。

浏览器缓存是否可能导致问题?

要手动使 service worker 的缓存失效,请进入DevTools > Application (tab) > Cache storage并删除其内容。

于 2019-11-12T15:42:02.227 回答