在显示 Web 应用程序之前完成加载缓存清单

Question

当您第一次正常加载带有缓存清单的 Web 应用程序时，会显示 HTML 页面，然后缓存清单开始在后台下载指定的文件。但是，我更喜欢缓存清单在初始页面出现在屏幕上之前完成下载每个列出的文件。这是为了在用户看到初始页面的那一刻，他或她可以断开与 Internet 的连接并按预期使用 Web 应用程序的所有功能。

我有办法做到这一点吗？

Answer 1

来源：https://developer.tizen.org/dev-guide/2.2.1/org.tizen.web.appprogramming/html/tutorials/w3c_tutorial/storage_tutorial/app_cache_managing.htm

我会查看应用缓存事件，尤其是 updateready 事件。

document.body.style.display = 'none'; //this should probably be in your stylesheet.    

applicationCache.addEventListener('cached', function() {
    /* All resources for update are downloaded */
    // show your webpage here
    document.body.style.display = 'block';
});

您可能还需要查看链接参考中列出的其他一些事件。我不知道如果没有更新，这个事件是否会触发。

但是如果没有清单文件，或者如果没有可用的更新等，则有几个事件。虽然看起来很简单。如果您有任何问题，请发表评论。

编辑

您还需要监听 noupdate 事件来处理清单未更新的情况。（谢谢@Applecot）

applicationCache.addEventListener('noupdate', function() {
    //no updates, display the page
    document.body.style.display = 'block';
});

在显示 Web 应用程序之前完成加载缓存清单

Finish loading cache manifest before showing Web app

html

javascript

cache-manifest