根据年龄删除服务工作者缓存中的条目

抹布工

服务工作者带来了极大的灵活性和强大功能,但同时也承担了很多责任……就需要控制缓存并避免不必要的增长。

有没有一种方法可以确定已缓存项目的存留期,即它位于缓存中的时间,并根据年龄定期清除已缓存项目?

我在这里考虑以下几方面:

const RUNTIME = 'runtime-cache';

var getAgeOf = function (request) {
    return (*time since request was cached*);  // <-- but HOW?
};

var purgeRuntimeCache = function (threshold) {      
    caches.open(RUNTIME).then(function (cache) {
        cache.keys().then(function (keys) {
            keys.forEach(function (request, index, array) {
                cache.match(request).then(function (response) {
                    if (getAgeOf(request) > threshold) {
                        console.log('delete old resource from runtime cache: ' + request.url);
                        cache.delete(request);
                    }
                });
            });
        });
    });
};
肉酱

Workbox员工似乎正在解析响应标题中的“日期”。如果日期不可用,他们还认为响应是最新的。此处检查他们的cacheExpiration插件来源我想在第一次从网络上获取资产时(例如,资产URL作为密钥),也可以将缓存时间节省到IndexedDB或Caches。

虽然手工完成这样的事情并深入研究是一个很好的练习,但是我的直觉说人们通常应该通过使用库来处理软件更好。工作箱可能是最好的选择。

更新:

我自己还没有尝试过,但是我看不出任何在实践中行不通的原因。

  • 使用idb-keyval之类的东西使使用IndexedDB作为keyval存储变得超级简单
  • 使用importScript(将其指向idb -keyval.min.js)将其包含在软件中
  • 缓存内容时,请使用其URL(字符串)作为IDB键,并以Unix时间作为值
  • 稍后,遍历缓存项并将它们与IDB中找到的时间戳进行比较。如果太旧,请从缓存中删除

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何卸载服务工作者?

Javascript服务工作者:从缓存中获取资源,但也进行更新

如何列出服务工作者已经存储在浏览器缓存中的博客帖子?

服务工作者和客户端请求“缓存控制”:“无缓存”

WebView:以编程方式清除服务工作者缓存

取消注册/删除服务工作者

使用CSRF令牌缓存请求时,如何减少服务工作者缓存的大小

服务工作者不会从缓存中返回文件

具有SSL证书缓存的服务工作者

PWA服务工作者缓存/更新预期行为

notificationclick事件服务工作者

注销时如何清除服务工作者缓存?

延迟加载或预加载Angular模块并使用服务工作者来缓存结果?

服务工作者列出缓存中的所有URL并传递给另一个函数

从create-react-app中的服务工作者缓存中排除index.html

如何根据服务工作者中的某些标志缓存响应

如何在服务工作者中刷新图片

在服务工作者中服务之前,可以编辑缓存的index.html吗?

如何防止服务工作者删除缓存,PWA

如何由服务工作者更新缓存的资源

服务工作者中的XMLHttpRequest

检查服务工作者缓存中是否存在URL

在服务工作者中添加图像和CSS文件以及HTML文件以进行离线缓存

嵌套获取服务工作者中的响应

服务工作者从磁盘缓存中缓存资源

服务工作者在反应中缓存的路由

服务工作者缓存与 VuexPersistence

角度缓存 - 我们应该使用服务工作者吗?

服务工作者缓存破坏谷歌地图 api