javascript - HTML5 `favorite` 离线缓存

Question

我目前正在构建一个应用程序，您可以使用它创建歌词播放列表并将其缓存以供离线使用。您还可以缓存您的收藏夹(JSON 数组)。

现在，由于收藏夹已缓存 - 添加收藏夹 按钮在客户端不起作用。是的，它确实在服务器端保存了收藏夹，但在客户端没有任何变化。

为了解决此问题，您建议我做什么？我唯一能做的就是在每次添加收藏夹点击时重新下载缓存，或者也许还有另一种方法可以解决这个问题？

请注意，我知道如何更新缓存。我只是想知道是否有更好的方法来解决这个问题。

谢谢!

Answer 1

我假设您需要通过 Javascript 更新 HTML5 应用程序缓存，在这种情况下，本指南应该解释您需要了解的所有内容:http://www.html5rocks.com/en/tutorials/appcache/beginner/

您可以做的是使用监听器来监视页面加载时的 updateready 事件。上述指南的片段:

// Check if a new cache is available on page load.
window.addEventListener('load', function(e) {

  window.applicationCache.addEventListener('updateready', function(e) {
    if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
      // Browser downloaded a new app cache.
      // Swap it in and reload the page to get the new hotness.
      window.applicationCache.swapCache();
      if (confirm('A new version of this site is available. Load it?')) {
        window.location.reload();
      }
    } else {
      // Manifest didn't changed. Nothing new to server.
    }
  }, false);

}, false);

当您更新问题并表示您知道如何更新缓存时，我也会更新我的答案。 Html5 appcache 旨在下载所有内容，并且没有“修复”您的问题 - 这就是它的设计方式。现在，如果您正在寻找替代解决方案，您可能想提出一个新问题。