没有更新的 HTML5 appCache 事件

Question

我有一个检查我的 list 状态的页面 oad 事件，如果有变化，它会要求用户重新加载。但是，我正在尝试绑定(bind) <button>手动检查 noupdate 上是否有状态.我似乎无法让它工作，这是我的代码:

window.addEventListener('load', function(e) {
  if (window.applicationCache) {
    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 App is available. Load it now?')) {
                window.location.reload();
          }
        } else {
          // no manifest change..
        }
    }, false);

    // if there is no update, display a message
    window.applicationCache.addEventListener('noupdate', function(e) {

      alert('App is up to date. ');

    }, false);

  }
}, false);

// check for a update each hour
setInterval(function () { window.applicationCache.update(); }, 3600000);

我的功能检测noupdate基本上会在页面加载时顺利触发我的警报，但如果我在绑定(bind)到按钮的函数中使用它......

<a href="javascript:refresh();" data-theme="a" data-role="button" 
data-icon="arrow-r" data-inline="true">Refresh</a>

<script>
    function refresh() {
        if (window.applicationCache) {
            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 App is available. Load it now?')) {
                        window.location.reload();
                  }
                } else {
                  // no manifest change..
                }
            }, false);

            // if there is no update, display a message
            window.applicationCache.addEventListener('noupdate', function(e) {

              alert('App is up to date. ');

            }, false);

          }
    }
</script>

它没有得到 noupdate 状态...

Answer 1

如果您在窗口加载时绑定(bind)事件监听器，如您的第一个代码块中所示，您需要在刷新函数中做的是:

<script>
    function refresh() {
      applicationCache.update()
    }
</script>

调用 applicationCache.update 后，“updateready”、“noupdate”或“error”事件将被触发。错误事件通常意味着无法下载应用程序缓存 list ，因为服务器无法访问。您可能还希望将监听器绑定(bind)到此事件。

顺便说一句，调用 window.applicationCache.swapCache() 对于您当前使用 appcache 的方式来说不是必需的。仅当您想要更新资源(例如页面上显示的图像)而不重新加载页面本身时才需要 swapCache。 window.location.reload() 足以完全重新加载所有资源，好处是您的所有 javascript 都会被再次评估等等。真正的重启。