HTML5“最喜欢的”离线缓存

时间:2013-03-28 18:58:56

标签: javascript html5 caching html5-appcache

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

现在,因为收藏夹被缓存 - add favorite按钮在客户端不起作用。是的,它确实在服务器端保存了收藏夹,但客户端没有变化。

为了解决这个问题,您建议我做些什么?重新:在每个add favorite点击缓存单击我唯一可以做的事情,或者可能还有另一个我怎么解决这个问题?

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

谢谢!

1 个答案:

答案 0 :(得分: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旨在下载所有内容,并且没有针对您的问题的“修复” - 这就是它的设计方式。现在,如果您正在寻找替代解决方案,您可能想提出一个新问题。