部署时出现奇怪的 Angular PWA Service Worker 行为

Question

这个问题花了我一整天的时间，我不明白发生了什么

我可以看到我的 Service Worker 已注册，但是“有时”当我在开发人员工具中单击离线时，我的域的 ServiceWorker 就会消失！

但这是主要问题，当我重新加载应用程序时，我看到以下行为。

您可以看到 ngsw.json 加载了两次，main.js 加载了 3 次！main.d3ae2084xxxx && main.bbe5073dxxxx && 然后再次 main.d3ae2084xxxx ！

如果我检查两个 ngsw.json 请求的响应，您可以看到两者都显示 main.d3ae2084xxxx 作为 main.js 的正确版本，但它仍然加载 main.bbe5073dxxxx...

第一个 ngsw.json 请求

第二个 ngsw.json 请求

更令人沮丧的是，实际加载的版本是以前的main.bbe5073dxxxx...！！！！

如果有人有任何想法如何发生这种情况，请告诉我。

更新...所以发现了这个优秀的小端点

https://you-app-url/ngsw/state 

这将为您提供有关 Service Worker 的大量调试信息。

就我而言，这个

驱动程序状态：EXISTING_CLIENTS_ONLY（由于初始化失败而降级：哈希不匹配（cacheBustedFetchFromNetwork）： https://dev-xxxx.net/main.eb8468bb3ed28f02d7c2.js：预期b5601102b721e0cf777691d327dc965d40d1c96e，得到83c18fdb4a594 2c964a31c119a57e0b8e16fe46e（缓存清除后）

因此，在我的情况下，这似乎是某种 CDN 问题，当我确定时将更新答案。

Answer 1

您现在可能已经解决了这个问题，但我遇到了同样的问题，结果是由于 CDN（在我的实例中是 Cloudflare）正在优化内容。

在 Cloudflare 中，关键选项是需要禁用的“自动缩小”。