0

我正在使用 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 文件,但Content-Type设置为text/cache-manifest并且Encoding设置为utf-8.

4

2 回答 2

0

我的示例在 Chrome 和 Safari 中运行没问题,并且在 Firefox 4 中进行了几次刷新后(我发现 FF 的 appcache 实现与其他实现相比有些“滞后”)。

大概您的日志代码中没有任何错误,它只是在修改 HTML 和清单文件后没有显示页面刷新的更改,对吗?

检查事项:

  1. HTML 格式是否正确?搞砸的 HTML 会导致错误(确保页面也是 HTML5)。
  2. 您是否在标记中引用了网站图标?如果没有,就这样做(即使它是一个空链接)——否则 webkit 会报错(不知道 FF)
  3. 当您更改缓存清单时,您是否每次都更改其文件大小,即添加/删除注释以改变行长?
  4. 测试缓存是否真的使用正确的内容类型。在 UN*X 中,您可以像这样从终端会话中执行此操作:或者在提供缓存文件时使用 Firebug 或类似方法检查标头curl -I http://your-domain/path/to/cache-manifest.manifest
  5. 检查缓存文件的路径在引用它的所有 HTML 页面中是否正确
于 2011-06-30T07:26:57.203 回答
0

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

简而言之:检查index.htm提供了哪些标头。

于 2011-07-01T10:55:58.403 回答