Question

我正在使用HTML5 applicationCache API，我在查看缓存页面的更新时遇到问题。我正在处理基础知识 - 更改清单文件，确保清单不在客户端缓存，并在下载新版本的缓存页面后重新加载页面（在onupdateready事件之后）。

我知道Chrome和FireFox支持applicationCache API，但我只能在Opera和Safari中看到所需的行为（更新清单后缓存页面的更改）。

因此，我如何确保能够在Chrome和FireFox中看到该页面的最新缓存版本？

这是我的HTML / JavaScript（index.htm）：

<!doctype html>
<html manifest="manifest.aspx">
<head>
    <title>Log</title>
    <script>
        window.onload = function () {

            if (window.applicationCache) {
                var log = document.getElementById("log");

                function logEvent(msg) {
                    log.innerHTML += "<li>" + msg + "</li>";
                }

                window.applicationCache.onchecking = function (e) {
                    logEvent("checking cache");
                }

                window.applicationCache.oncached = function (e) {
                    logEvent("cached");
                }

                window.applicationCache.onupdateready = function (e) {
                    logEvent("update ready");
                    logEvent("swapping cache");
                    applicationCache.swapCache();
                }

                window.applicationCache.onnoupdate = function (e) {
                    logEvent("no update");
                }

                window.applicationCache.onobsolete = function (e) {
                    logEvent("obsolete");
                }

                window.applicationCache.ondownloading = function (e) {
                    logEvent("downloading");
                }

                window.applicationCache.onerror = function (e) {
                    logEvent("error");
                }

                logEvent("window load");
            }
        }
    </script>
</head>
<body>
    <div>
        <h1>Message Logger 15</h1>

        <div id="eventLogContainer">
            <h2>Event Log</h2>
            <ul id="log"></ul>
        </div>

    </div>
</body>
</html>

这是我的清单（manifest.aspx）：

CACHE MANIFEST
# version fifteen

CACHE:
index.htm

我的清单是一个ASPX文件，但内容类型设置为text/cache-manifest，编码设置为utf-8。

Answer 1

我让您的示例在Chrome和Safari中工作没有问题，并且在Firefox 4中进行了几次刷新后（我发现FF的appcache实现与其他实施相比有点“滞后”）。

据推测，您的日志记录代码没有出现任何错误，只是在修改HTML和清单文件后没有显示页面刷新的更改，是吗？

要检查的事项：

HTML格式正确吗？搞砸的HTML会导致错误（确保页面也是HTML5）。
您在加分中引用了一个图标吗？如果没有，那么这样做（即使它是一个空链接） - webkit将报告错误（否则不知道FF）
当您更改缓存清单时，您是否每次都要更改其文件大小，即添加/删除注释以使行长度发生变化？
测试缓存是否真的以正确的内容类型提供。在UN * X中，您可以通过以下终端会话执行此操作：curl -I http://your-domain/path/to/cache-manifest.manifest或者使用Firebug或类似方法在提供缓存文件时检查标题
检查引用它的所有HTML页面中缓存文件的路径是否正确

Answer 2

虽然更新缓存清单会导致浏览器检查新文件，但是是否从服务器或本地浏览器缓存中获取这些文件是由常规缓存规则决定的。因此，如果您的浏览器配置为每天仅查找一次任何文件的新版本，或者将来的过期标头与缓存清单中列出的文件一起提供，则更新清单文件时将不会更新这些文件（除非您清空浏览器缓存，或执行CTRL + F5）。

简而言之：检查哪些标题index.htm正在投放。

Chrome / FireFox未显示离线页面的更新

2 个答案: