HTML5离线缓存Manifest是什么

2020-04-21 22:50:55易采站长站整理

    
…   
    
if (appCache.status == window.applicationCache.UPDATEREADY) {   
    
  appCache.swapCache();  // The fetch was successful, swap in the new cache.   
    
}   
  

注意:像这样使用 update()和swapCache()并不会将更新后的资源 呈现给用户。这仅仅是让浏览器检查manifest文件是否发生了更新,然后下载指定的更新内容,重新填充app cache。因此,要让用户看到更新后的内容,需要两次页面下载,一次是更新app cache,一次是更新页面内容。

为了让用户能看到你的站点的最新版本,设置一个监听器来监听页面加载时的updateready 事件。

C/C++ Code复制内容到剪贴板

// 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();   
        window.location.reload();   
    
    } else {   
    
      // Manifest didn’t changed. Nothing new to server.   
    
    }   
    
  }, false);   
    
}, false);   

监听事件,对不同的状态做出相应处理:

C/C++ Code复制内容到剪贴板

var appCache = window.applicationCache;   
  
// Fired after the first cache of the manifest.   
  
appCache.addEventListener(‘cached’, handleCacheEvent, false);   
    
// Checking for an update. Always the first event fired in the sequence.