缓存优先 Service Worker:如何绕过更新资产的缓存?

2023-12-23

这是场景:

您有一个当前通过软件缓存的站点。您部署一个新版本,其中包含带有缓存清除版本的更新软件。然后该公司宣布了新功能。然而,人们访问该站点时,即使软件崩溃,它仍然会提供以前的缓存,同时在后台更新其缓存。因此,前来寻求新功能的访问者看不到它们。

这是 ServiceWorkers 的预期体验吗?解决这个问题的推荐策略是什么?


是的,每当您使用缓存优先策略提供资源时,这都是预期的行为。

有两种选择:

  • 不要使用缓存优先 https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#cache-falling-back-to-network战略。不幸的是,如果您使用 Service Worker,您将失去 Service Worker 的大部分性能优势网络优先 https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#network-falling-back-to-cache战略。如果可以的话,我不建议您选择网络优先。
  • 采用在屏幕上显示“重新加载最新更新”消息的 UX 模式,让用户知道缓存的内容已刷新,并允许他们采取操作以查看最新内容。我认为这是最好的方法。如果您使用的是 Service Worker,只要您的缓存内容发生更改(例如,由sw-precache https://github.com/GoogleChrome/sw-precache),然后您可以通过侦听特定服务工作线程控制器事件来检测这些更新,并使用这些事件来触发消息。 (这里是一个例子 https://github.com/GoogleChrome/sw-precache/blob/master/demo/app/js/service-worker-registration.js#L31.)
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

缓存优先 Service Worker:如何绕过更新资产的缓存? 的相关文章

  • self.skipWaiting() 在 Service Worker 中不起作用

    我有一个服务人员 这是安装事件 self addEventListener install function event console log Installing Service Worker event return self ski
  • 为什么必须在 Service Worker 中克隆 fetch 请求?

    在 Google 的 Service Worker 示例之一中 缓存并返回请求 https developers google com web fundamentals getting started primers service wor
  • 在页面之间导航时显示加载程序 - PWA

    我有一个基于 PHP 的网站 我用过service workers and manifest json将网站转换为PWA 现在 当我从主屏幕启动 PWA 时 它可以像应用程序一样正常工作 但是 问题在于 由于 PWA 不显示浏览器地址栏 用
  • Service Worker 和网页之间的通信

    我正在开发一个应用程序 其目标是定期 例如每小时 向用户发送通知 我的想法是使用一个服务工作者 该服务工作者可以在选项卡关闭后运行 并继续向用户发送这些通知 网页需要能够与 Service Worker 沟通有关这些通知的具体细节 消息应该
  • React (CRA) Service Worker 缓存“公共”文件夹

    执行 create react app 并启用 Service Worker 后index js 来自的所有相关文件src文件夹被缓存 然而我的一些资源位于public目录 当我跑步时npm run build the asset mani
  • AJAX (XMLHttpRequest) 进度监控不适用于 Service Workers

    我想将网络表单转换为离线工作 最初 我会在用户完成每个步骤后将表单信息存储在 Web 服务器上的 SQL 数据库中 其中一个步骤包括上传图像 为此我实现了一个进度条 添加服务工作者后 我注意到进度条不再起作用 进度条会显示 但永远不会更新以
  • 使用 Service Worker 处理离线时的文件上传

    我们有一个 Web 应用程序 使用 AngularJS 构建 我们也逐渐添加 PWA 功能 服务工作线程 可启动项 通知等 我们的网络应用程序的功能之一是能够在离线状态下完成网络表单 目前 我们在离线时将数据存储在 IndexedDB 中
  • Service Worker 注册失败

    我目前正在研究服务人员来处理浏览器中的推送通知 目前我遇到了 软件注册失败错误 软件注册失败 出现错误 SecurityError 无法注册 ServiceWorker 不支持当前源 null 的 URL 协议 Check client1
  • Service Worker 和 AppCache 的比较

    Service Worker 和 AppCache 之间的核心区别是什么 每种方法的优点和缺点是什么 何时更喜欢其中一种 主要区别在于 AppCache 是一个高级声明式 API 您可以使用它指定希望浏览器缓存的资源集 而 Service
  • 如何在使用清单 v3 制作的 Chrome 扩展中使用 Web 套接字显示实时数据?

    我正在开发一个简单的扩展 我想在其中展示RealTime通过网络套接字连接从我的服务器发送的数据 我正在使用 chrome 的清单 v3 来实现这一点 我尝试通过网络套接字连接我的扩展background js它作为 Service Wor
  • 向请求添加新标头,同时保留正文

    我正在为我的公司建立一个内部使用的 PWA 我应该使用什么方法将不记名令牌附加到来自 dom 或 web worker 的所有请求 我在发布时使用的这种方法可以按预期工作form or json但我想要一种更干净或更友好的方法 因为我不相信
  • 我如何在 chrome Extension(manifest V3) 的服务工作者中包含 socket.io-client

    我从 cdn 复制了客户端 socket io 脚本 然后使用 importScript 但是当我真正运行时它给出了 ReferenceError document is not defined at JSONPPolling doPoll
  • Service Worker 创建的缓存存储在下线刷新页面后消失

    我正在尝试为我的网络应用程序实现离线功能 但离线时我遇到了一些奇怪的行为 这可能是我所缺少的 因为它在 Chrome 和 Firefox 中都可以重现 我将在下面描述什么示例应用程序 https github com mzenz vanis
  • 如何将更新部署到在客户站点上运行的服务工作人员?

    假设我提供不同网站使用的推送通知服务 此服务需要在我的客户站点上安装 Service Worker 我希望该架构具有一些属性 完全静态资源 安装 Service Worker 文件 配置 JS 片段等过程只需完成一次 随时更新 Servic
  • 如何避免 MV3 Chrome 扩展中同时存在多个 Service Worker?

    我正在将 Chrome 扩展程序从清单版本 2 MV2 转换为清单版本 3 MV3 在MV2版本中 后台页面脚本在扩展中具有突出的作用 在启动时 后台脚本从IndexedDB读取大量数据到RAM 然后 在运行期间 处理注入到页面中的内容脚本
  • 检测 Service Worker 离线状态的最佳实践

    我有一个服务工作者应该缓存一个offline html客户端没有网络连接时显示的页面 然而 有时它会认为导航器已离线 即使它并未离线 那是 navigator onLine false 这意味着用户可能会得到offline html而不是实
  • 硬刷新后注册 Service Worker

    每当硬刷新后重新加载具有 Service Worker 的 Web 应用程序时 Ctrl F5例如 对于 Chrome Service Worker 之后无法注册 根据文档W3C https w3c github io ServiceWor
  • Angular service-worker范围在安装过程中遇到错误

    我正在尝试使用 Angular Service Worker 但在尝试使用它时出现错误 这些是我的版本 Angular CLI 15 2 0 Node 16 18 1 Package Manager npm 8 19 2 OS linux
  • 无法将消息发布到服务工作人员,因为控制器值为空

    我正在尝试做一个website https secure depths 31934 herokuapp com 在 Service Worker 的帮助下可以离线使用 以缓存页面所需的文件 我试图让用户控制他希望缓存的图像 为此 我使用一个
  • “窗口未定义”服务工作者

    我正在尝试为我的 django 项目注册一个服务人员 这是我用于注册的代码

随机推荐