作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 ( using a cache manifest ),我想显示一个准确的进度条,让用户知道哪些文件到目前为止已下载,哪些文件正在下载仍悬而未决。类似于以下内容:
Loading... /assets/images/logo.png: loaded /assets/images/splashImage.png: pending
我知道我可以使用缓存“待处理”事件,但我没有看到事件参数有任何与之关联的数据。
有什么办法可以做到这一点吗?
最佳答案
每个文件下载时都会触发一个 progress
事件,但其负载不包含我测试过的任何浏览器(Chrome、Safari、FF beta)中的文件名。 Chrome 在控制台中显示文件名(尽管据我所知 JS 无法访问),但 Safari 和 FF 都没有做到这一点。据我所知,这些文件的下载顺序与 list 中列出的顺序不同,因此甚至没有一种方法可以生成有序列表,然后一次删除一个列表。
所以回答你的问题,不,现在没有任何方法可以做到这一点。将来 progress
事件可能会包含文件名 - 至少在某些浏览器中 - 但现在这是不可能的。
我应该补充一点,在 Chrome 中(而不是在 Safari 或 FF 中),您至少可以获取要下载的文件数量,从而至少可以计算出准确的进度条。要在 Chrome 中获得此功能,您可以使用以下命令:
function downloadProgress(e) {
totalfiles = Number(e.total);
}
window.applicationCache.addEventListener("progress", downloadProgress, false);
但是,这在其他浏览器中会出错,因此您需要包装 try/catch
或其他一些方法 (typeof(e.total)
) 以避免错误。
关于javascript - HTML 离线应用程序缓存,列出下载的文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5121130/