有没有办法从缓存清单文件下载所有文件和缓存

时间:2012-03-15 12:46:17

标签: html html5

默认情况下,html5缓存的工作方式是清单中提到的文件/ page / js / css / image在首次加载时被缓存,但我要求所有文件都应该从我的主页一次缓存....

2 个答案:

答案 0 :(得分:1)

Appcache更新是原子的。在下载清单中引用的所有文件之前,不会使用appcache来为它们提供服务。如果您需要加载所有内容,请将所有内容放入清单中。使用脚本生成清单文件而不是使用通配符。

答案 1 :(得分:0)

我得到了一个脚本来缓存您在清单文件中提到的所有文件。

<!DOCTYPE html>
<html manifest='../cache.manifest'>// reference path of your manifest file
<head>

<title>Untitled Document</title>
<script type="text/javascript">
    var cacheStatusValues = [];
    cacheStatusValues[0] = 'uncached';
    cacheStatusValues[1] = 'idle';
    cacheStatusValues[2] = 'checking';
    cacheStatusValues[3] = 'downloading';
    cacheStatusValues[4] = 'updateready';
    cacheStatusValues[5] = 'obsolete';

    var cache = window.applicationCache;
    cache.addEventListener('cached', logEvent, false);
    cache.addEventListener('checking', logEvent, false);
    cache.addEventListener('downloading', logEvent, false);
    cache.addEventListener('error', logEvent, false);
    cache.addEventListener('noupdate', logEvent, false);
    cache.addEventListener('obsolete', logEvent, false);
    cache.addEventListener('progress', logEvent, false);
    cache.addEventListener('updateready', logEvent, false);

    function logEvent(e) {

        var online, status, type, message;
        online = (navigator.onLine) ? 'yes' : 'no';
        status = cacheStatusValues[cache.status];
        type = e.type;
        message = 'online: ' + online;
        message += ', event: ' + type;
        message += ', status: ' + status;
        if (type == 'error' && navigator.onLine) {
            message += ' (prolly a syntax error in manifest)';
        }
        alert(message);
        document.getElementById("lblEvents").value = message;

    }

        window.applicationCache.addEventListener(
        'updateready',
        function () {
            window.applicationCache.swapCache();
    window.location.reload();
        },
        false
      );
        // end Script 
 </script>
</head>

<body>
<!--
 Your body tags
-->
</body>
</html>