问题标签 [sw-toolbox]

我正在使用sw-precachewithsw-toolbox以允许离线浏览 Angular 应用程序的缓存页面。

该应用程序通过 node express 服务器提供服务。

我们遇到的一个问题是index.html有时似乎没有在缓存中更新，尽管其他资产在激活新的 service worker 时已经更新。

在这种情况下，这会给用户留下一个index.html试图加载不再存在的版本化资产的过时资产/scripts/a387fbeb.modules.js。

我不完全确定发生了什么，因为似乎在index.html已正确更新的不同浏览器上具有相同的哈希值。

在一个浏览器上过时（有问题）Index.html

2cdd5371d1201f857054a716570c1564（用哈希缓存）包括：

在其内容中。（此文件不再存在于缓存或远程）。

在另一个浏览器上更新（好）index.html

（同缓存2cdd5371d1201f857054a716570c1564）包括：

虽然返回给浏览器的内容不同，但这两个缓存是一样的！

我该怎么办？这是否意味着sw-precache当新软件激活时不能保证原子缓存失效？一个人怎么能免受这种伤害？

如果这些有帮助，这是生成的 service-worker.js文件sw-precache。

注意：我意识到我可以使用remoteFirst策略（至少 for index.html）来避免这种情况。但我仍然想了解并找出一种使用cacheFirst策略来充分利用性能的方法。

注意2：我在其他相关问题中看到可以更改缓存的名称以强制破坏所有旧缓存。但这似乎打败了sw-precache只破坏更新内容的想法？这是要走的路吗？

注意3：请注意，即使我硬重新加载网站损坏的浏览器。该站点将工作，因为它会跳过服务工作人员缓存，但缓存仍然是错误的 - 服务工作人员似乎没有激活 - 我的猜测是因为这个特定的 SW 已经被激活但未能正确破坏缓存。随后的非硬刷新访问仍然会看到损坏的index.html.

我正在尝试存储站点正在进行的 XHR get 调用的结果，以便如果没有互联网连接，我希望从 cache/indexedDB 中检索数据。我在我的服务人员中使用Sw-toolbox 。我正在访问的 URL 是“ https://www.domain.in/field?searchparams=123 ”，我尝试这样做，

但我没有找到任何线索，我做错了吗？请帮忙 。

故事

我有一个使用传统浏览器缓存的网站，该网站被大量缓存，静态内容长达 365 天。

为了在部署新版本后清除缓存，我使用了一个版本标识符的查询字符串，例如：

但是对于版本的每次升级，加载时间都很糟糕，因为当查询字符串发生变化时，浏览器需要下载所有新内容。

情况

现在，我们有了 Service Worker，我已经将它集成到我的网站中。到目前为止一切正常，版本标识符的查询字符串仍然可以使用。

并且与 SW 集成之前相同的行为仍然存在。然而升级很慢，就像往常一样......

问题

我想知道是否有更好的方法？它可以执行以下操作，并且仍然保留繁重的缓存机制（对于旧浏览器）：

1. 发现新版本
2. 仍然使用最新版本的旧内容，
3. 在去获取新版本的所有新内容下，
4. 下次用户访问该站点时，他们将使用最新版本。

注意它的目标是在部署新版本时更快地加载站点

我正在使用服务工作者创建一个渐进式 Web 应用程序，并且我正在使用服务工作者工具箱来缓存我的内容。用于缓存我的内容的服务人员代码：

代码运行良好，因为我在控制台中没有看到任何错误。但是我如何检查来自云端的图像或上面配置的 url 是否被缓存并从缓存本身呈现。

我们正在尝试sw-precache允许对所有静态资源进行预缓存。我们只是在考虑采用哪种方法来预缓存文件名中包含 MD5 指纹的版本化资源。

第一个解决方案可能是使用sw-toolbox和匹配 URL 模式并缓存它们。每当您生成具有新指纹的文件时，它都会自动获取缓存，是的，它有一个可以自行管理旧缓存的问题。

第二种解决方案可能是sw-precache处理相同的问题，并且它具有自动处理旧缓存的优势。我已经尝试过了，但我发现有时即使在多个页面刷新甚至重新打开浏览器选项卡时资源也不会更新。

请建议！

虽然我熟悉库Sw-precache，Sw-toolbox但仍然对如何在使用 Angular 构建渐进式 Web 应用程序时满足动态依赖关系感到困惑。

我使用 Sw-precache 构建过程为我的应用程序预缓存了 bundle.js、bundle.css 和一些静态模板。（假设我所有的模板（.html 文件）都依赖于 bundle.js 和 bundle.css）

1. 如果我更新未预缓存的模板怎么办？如何确保更新 bundle.js/css 连同我的模板。

2. 如果我更新已经预缓存的模板怎么办。它是否总是与预缓存的 bundle.js/css 文件一起更新。

3. 最后一个用例，当我的模板已经预缓存但它有一些带有 src 属性的内联脚本并且这个脚本文件没有缓存在任何地方时。假设我对模板和脚本文件进行了一些更改。我应该遵循什么缓存方法来确保模板文件与脚本文件一起更新。

我们没有遵循纯 App-shell 架构，它就像使用 Angular.js 设计的单页应用程序

我是Codiva-java ide 和在线编译器的开发人员。我正在努力改进离线支持，减少网络使用，通过尽可能多的预缓存来减少延迟。

我想知道如何处理对谷歌分析的请求。

1. 首先是 ga 脚本。我使用谷歌标签管理器来设置 GA。缓存那个请求可以吗，也就是这个请求可以使用networkFirst策略吗？还是应该始终是 networkOnly？

2. 如何确保正确跟踪离线发生的操作？

3. 我打算开始使用 Firebase 来处理一些功能，firebase 也有一些分析。当设备离线时，它会自动处理分析吗？

我一直在尝试将swtoolbox用于服务人员。在某些情况下，我想使用 url 模式匹配来制作仅网络和仅缓存。

我仍然坚持让它工作。

基本用法工作正常。

当我开始使用正则表达式时。它没有按预期工作。

如果有人尝试这样做使它起作用，那就太好了。我曾经用来验证我的正则表达式首先在那里工作正常。https://regex101.com/

我在运行时缓存选项中使用带有 sw-precache 的 sw-toolbox。但是当我访问 url 并在 devtools 中检查网络时，它显示从服务人员缓存而不是首先从网络缓存（如我所愿）。也许我只是不明白这两个库是如何一起工作的。我当前的实现使用 sw-precache 来缓存我的整个 webapp（非常小的 webapp）并使用运行时缓存选项，我首先使用了带有网络处理程序的 url 模式。我的想法是，即使整个应用程序都被缓存了，当我使用特定的 url 模式时，页面上使用的数据将从网络而不是缓存中获取。这是不正确的吗？

这是我的吞咽任务：

});

从上面的配置中，登录和管理路由仅使用网络获取，索引路由首先从缓存中提供，但我希望它首先是网络，因为我是从服务器端绑定我的页面。所以动态数据不会在应用程序中复制，除非 ctrl + f5