如何列出已由 Service Worker 存储在浏览器缓存中的博客文章？答案

【问题标题】：How can I list my blog posts already stored in the browser cache by a Service Worker?如何列出已由 Service Worker 存储在浏览器缓存中的博客文章？
【发布时间】：2017-05-11 22:45:27
【问题描述】：

我的博客已经有a working Service Worker 缓存最近的帖子，即使用户离线也可以阅读。

在the offline page 上显示缓存中不可用的内容，我想列出缓存中的最近帖子，让用户有机会在离线时阅读它们。

在标准窗口上下文中，而不是在 Service Worker 上下文中，是否有一种简单的方法来列出此类内容？

我找不到任何教程。我发现的所有教程都只涉及 Service Worker 部分。

谢谢。

【问题讨论】：

标签： caching browser-cache offline service-worker progressive-web-apps

【解决方案1】：

除了在 Workers 中可用之外，Cache Storage API 还可以作为 window 全局范围的一部分使用，例如 window.caches。

这是来自full example 的一段摘录，内容是使用该接口获取所有缓存内容的列表：

window.caches.keys().then(function(cacheNames) {
  cacheNames.forEach(function(cacheName) {
    window.caches.open(cacheName).then(function(cache) {
      return cache.keys();
    }).then(function(requests) {
      requests.forEach(function(request) {
        // Do something with request, like update your UI
        // based on request.url.
      });
    });
  });
});

【讨论】：