1

我有一个使用缓存清单的启用离线的网站。我发现 Chrome 正在为我的样式表的旧版本提供服务，即使我执行“空缓存和硬重新加载”

如果我将 ?foo=bar 附加到页面的 URL 或 CSS，则会交付新版本的 CSS。

我的清单是在 /Manifest/Index 动态生成的（例如）

如果我在 Chrome 中打开页面并查看 Fiddler，我会看到向 Web 服务器发出了一个请求，正如预期的那样：

#   Result  Protocol    Host    URL Body    Caching Content-Type    Process Comments    Custom  
6   200 HTTP    10.6.4.67   /Manifest/Index 2,476   no-cache  Expires: -1   text/cache-manifest; charset=utf-8  chrome:5484

这是 /Manifest/Index 的标题详细信息

GET /Manifest/Index HTTP/1.1
Host: 10.6.4.67
Connection: keep-alive
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.11 (KHTML, like Gecko) 
Chrome/23.0.1271.97 Safari/537.11
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3
HTTP/1.1 200 OK
Date: Thu, 10 Jan 2013 17:59:42 GMT
Server: Microsoft-IIS/6.0
X-Powered-By: ASP.NET
X-AspNet-Version: 4.0.30319
X-AspNetMvc-Version: 4.0
Cache-Control: no-cache
Pragma: no-cache
Expires: -1
Content-Type: text/cache-manifest; charset=utf-8
Content-Length: 2476

谁能告诉我为什么这个缓存清单中的 CSS 文件引用没有更新，除非我将缓存清除查询字符串变量附加到 CSS？特别是即使我清空 Chrome 的缓存？？！

更多信息：

如果我更新缓存清单，我可以打开 Chrome 的控制台并看到 App Cache 事件触发：

文档是使用清单 /Manifest/Index 从应用程序缓存加载的

应用程序缓存检查事件

应用程序缓存下载事件

应用程序缓存进度事件 (0 of 61) http://xxxx/Content/themes/base/jquery.ui.progressbar.css

应用程序缓存进度事件 (1 of 61) http://xxxx/Content/themes/base/jquery.ui.accordion.css

剪断

应用程序缓存进度事件 (54 of 61) http://xxxx/Content/Site.css

我确实注意到此列表中的某些项目，例如 Site.css，带有下划线。这是为什么？

谢谢，

克里斯

4

1 回答 1

0

使用： chrome://appcache-internals/ 清除 Chrome 中的 appcache 并将其删除。

此外，每次更改其中包含的文件以下载新副本时，您都需要重建清单文件。

这是通过在清单中使用随机数并在编辑文件时生成它来完成的。

例如在 node.js 中

function generateCacheManifest(...) {
    manifest = 'CACHE MANIFEST';
    manifest += '#version ' + Math.random();
    ...
}

是的，随机数可以在评论中。关键是 Chrome 会检查缓存清单，当它发现没有任何变化时，它不会获取更新的文件。

更改文件，更改清单，就这么简单。

于 2013-02-05T04:56:05.287 回答