javascript - 如何使用 Service Worker 识别服务器上的更新？

Question

是否可以识别服务器上的更新，即页面 (HTML) 或样式 (CSS) 是否有更新，并向服务器发出请求以获取更新的数据？如果是，怎么办？

Answer 1

不久；

1. 当您的 Service Worker 脚本更改时，一旦用户使用您的 PWA 上线，它将设置为替换用户拥有的旧脚本。
2. 您应该反射(reflect)对 SW 中的项目数组的更改。
3. 您应该更改缓存的名称，并删除旧的缓存。
4. 因此，您的用户将始终拥有最新版本的应用。

详细信息；

1) 更改您的 SW 以替换当前拥有的一个用户。

即使您的 SW 有最细微的变化也足以将其视为新版本，因此它将接管旧版本。此引自Google Web Developers解释一下；

Update your service worker JavaScript file. When the user navigates to your site, the browser tries to redownload the script file that defined the service worker in the background. If there is even a byte's difference in the service worker file compared to what it currently has, it considers it new.

最佳做法是在您的 SW 中的任何位置保留一个版本号，并在内容更改时以编程方式更新它。它甚至可以被引用，没关系，它仍然有效。请记住:即使是一个字节的差异也足够了。

2) 反射(reflect)您对要缓存的项目列表的更改。

您在您的 SW 中保留要缓存的 Assets 列表。因此，将添加/更新/删除的 Assets 反射(reflect)到您的列表中。最佳做法是 setting up cache buster为您的 Assets 。这是因为 SW 位于浏览器缓存后面的一层，可以这么说。

换句话说:从 SW 获取请求通过浏览器缓存。因此 SW 将从浏览器缓存而不是服务器中选择新 Assets ，并缓存这些 Assets 直到 SW 再次更改。

在这种情况下，你将有一半的用户使用你的 PWA 和新 Assets ，而另一半则遭受令人难以置信的错误。如果您因无法找到原因或重现这些问题的方法而过度提示和沮丧，您会度过一段美好的时光。

3) 替换您的旧缓存，不要合并它。

如果您不为更新后的 Assets 列表更改缓存的名称，这些 Assets 将与旧 Assets 合并。

合并将以一种方式发生，旧的和移除的 Assets 将被保留，而新的 Assets 将被添加和更改的 Assets 将被替换。虽然这样看起来一切正常，但您将在用户的设备上积累旧 Assets 。 And space you are storing is not infinite.

4)大家都很开心

实现和跟踪所有提到的事情可能看起来很乏味，但我向您保证，否则您将开始有更多更不愉快的事情要处理。不满意的用户将是一个不错的加分项。

因此，我鼓励您一次性设计您的软件。