Workbox仅缓存时间戳到indexDb,如何拦截indexDb中的json数据?

2024-01-25

下面的路由定义将json数据作为MyCachedData存储在缓存存储中,而IndexDb只存储url和时间戳。

workboxSW.router.registerRoute('/MyApi(.*)',
workboxSW.strategies.staleWhileRevalidate({
    cacheName: 'MyCachedData',
    cacheExpiration: {
        maxEntries: 50
    },
    cacheableResponse: {statuses: [0, 200]}
 })
);

是否可以仅将 json 数据存储在索引数据库中,如何定义它以使用 Workbox 拦截(添加、更新、删除)?


不,Workbox 依赖于缓存存储API https://developer.mozilla.org/en-US/docs/Web/API/CacheStorage存储响应的主体。 (正如您所观察到的,它使用 IndexedDB 来获取一些带外管理信息,例如用于缓存过期的时间戳。)

如果使用缓存存储 API 的方法不适合您的用例(很高兴听到为什么不?),那么我建议直接更新 IndexedDB,也许通过像这样的包装器库idb-keyval https://github.com/jakearchibald/idb-keyval.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Workbox仅缓存时间戳到indexDb,如何拦截indexDb中的json数据? 的相关文章

  • 难以通过网络蓝牙连接热敏打印机

    现在我正在开发能够连接热敏打印机的网络 我正在使用 Angular 框架 并且我使用库成功将热敏打印机与 USB 连接ng thermal printer 但我希望我的网络也能够通过网络蓝牙 BLE 蓝牙低功耗 连接热敏打印机 据我所知 B
  • 如何在 Firefox 中调试 Service Worker?

    在 FF 中调试 Service Worker 似乎非常痛苦 我知道从主页我可以 进入应用程序面板 点击 关于调试 在新页面中搜索我的员工以及其他 200 名员工 单击开始 然后单击检查 我必须寻找两个控制台而不是一个并通过 两者之间的消息
  • 有没有办法在 iOS 上自动更新(或只是清除缓存)PWA?

    我一直在 iOS 上努力尝试一些在 Android 上可以轻松运行的东西 让我的 PWA 在有新版本时自动更新 我根本不确定这在 iOS 上是否可行 我使用 vue js 和 Quasar 来构建我的应用程序 一切都可以在 Android
  • 通过 VPN 在 Android 上创建 WebAPK 失败

    我的公司 VPN 阻止来自 Android 设备的所有外部流量 我正在尝试测试内部托管的 PWA 防火墙内的所有资源 我观察到 尽管通过了 Lighthouse 审核 但我的 PWA 在设备上的 WebAPK 创建过程中失败了 具体来说 安
  • 如何在React项目中添加Service Worker

    我想在我的 React 项目中添加 Service Worker 项目已准备就绪 默认服务似乎不起作用 即使当我尝试导入它时 它也会出现以下错误 尝试导入错误 registerServiceWorker 不包含默认导出 导入为 regist
  • SSR 如何与 PWA 结合

    如何使用 PWA 渐进式 Web 应用程序 进行 SSR 服务器端渲染 据我了解 SSR SSR 运行时将加载页面并运行必要的脚本以将数据加载到页面上 然后返回渲染后的html 这对于不会运行 javascript 的网络爬虫和无脚本的浏览
  • 请确保您的 Service Worker 文件包含以下内容:/(const precacheManifest =)\[\](;)/

    我对 React Workbox 还很陌生 我试图让我的 Electron React 应用程序能够缓存所有图像和数据 以便在离线时可用 这正是我在 YouTube 视频中想要实现的目标 14 00 到 21 00 分钟 使用 React
  • 未捕获(承诺中)DOMException:超出配额

    我正在尝试查看离线状态演示 https serviceworke rs offline status demo html从下面的链接 我得到 DOMException 超出配额 https serviceworke rs offline s
  • @Injectable(providedIn: 'root') 的语义?

    只是想确保我理解的语义 Injectable providedIn root 在 Angular 6 之前 如果我们从 NPM 导入包含服务的模块 我们会在应用程序模块中声明该模块 以便整个应用程序都可以访问该服务 像这样的事情 impor
  • 渐进式 Web 应用程序:离线缓存在 Android 上不起作用,但在 Chrome 开发工具上起作用

    我有一个简单的 PWA 可以在网上正常运行 我还在 Chrome 开发工具中测试了离线行为 并且 Service Worker 正在完美地完成其工作 但是 当我从 Android 手机运行该应用程序时 它无法离线工作 因为离线时缓存存储不再
  • 渐进式 Web 应用程序 - 不尊重屏幕方向

    我的网络应用程序不遵循我的设置中的方向manifest json manifest version 2 version 1 name My App short name My App icons src img myapp launcher
  • 渐进式 Web 应用程序的预期启动体验是什么?

    测试渐进式 Web 应用程序 当我在飞行模式下启动应用程序时 我得到了意外的启动 启动体验 Android Chrome 从主屏幕体验启动 我看到一个白色的屏幕 然后是 离线恐龙 的短暂闪烁 然后应用程序成功启动 一切正常 启动时间比我预期
  • Firebase 推送通知在 NuxtJS 中停止工作

    我再次在推送通知方面遇到一些麻烦 几周前相同的代码也有效 昨天我无意中发现推送通知不再起作用 我正在做的和写的一样文档 https firebase google com docs cloud messaging js receive 我使
  • 无法查看 Service Worker 日志

    看不到我的 Service Worker 的日志 以下是我尝试打开已注册和正在运行的服务工作人员日志的步骤 Open chrome serviceworker internals 单击开始并检查 刷新检查窗口 等待日志出现 但是 两者chr
  • Workbox:构建项目时无法缓存所有文件

    I use Vuejs我用workbox webpack plugin为了使我的网站离线 我想缓存一个包含我所有文件 3个文件 的文件夹 如下图所示 但是当我构建我的项目时 使用Laravel mix The main js 包含 Vue
  • 如何在 create-react-app 中以开发模式启用 Service Worker?

    我知道我们可以在生产模式下测试我们的 Service Worker 但是重新构建和部署的过程非常烦人 有什么方法可以在开发模式下启用服务工作者吗 改变这个 window addEventListener load gt const swUr
  • 在应用商店上发布 PWA:google play 和 ios itunes

    有没有办法在应用商店上发布 PWA 来发布应用 谷歌播放和 iOS iTunes 不用用科尔多瓦制造一辆越野车 这会带来大量的维护问题 是的 有办法将您的 PAW 发布到 Android 应用商店 TWAs可信 Web 活动是一种使用基于自
  • 打开 Chrome 扩展程序时出现 Service Worker TypeError

    当我打开 WAVE Web 可访问性评估工具 扩展时 我的服务工作人员在 Chrome 中抛出此错误 未捕获 承诺中 类型错误 请求方案 chrome extension 是 不支持的 在 sw js 52 匿名 sw js 52 Prom
  • 如何使用 Laravel Mix 和 WorkBox?

    我正在尝试为我的应用程序构建一个 PWA 并花了近 48 小时试图弄清楚如何将 Workbox 与 Laravel Mix 结合使用 具有讽刺意味的是 谷歌说 Workbox 是为了让事情变得简单 Buh 好吧 到目前为止我已经弄清楚了 我
  • Angular service-worker范围在安装过程中遇到错误

    我正在尝试使用 Angular Service Worker 但在尝试使用它时出现错误 这些是我的版本 Angular CLI 15 2 0 Node 16 18 1 Package Manager npm 8 19 2 OS linux

随机推荐