HTML5离线应用程序缓存在Firefox中没有显示更新

Question

HTML5离线应用程序缓存在Firefox中没有显示更新

htmlfirefoxoffline-cachingapplication-cachemanifest.cache

3

我有一个位于我的docroot中的index.php文件。它产生的输出以以下内容开头：

<!DOCTYPE html> 
<html manifest="manifest.appcache">

manifest.appcache 告诉浏览器将其缓存以供脱机使用。再说一遍，相关的部分：

CACHE MANIFEST

#version 8-25-2011

CACHE:

#internal HTML documents
#this tells the browser to cache the HTML it retrieves from http://example.com/
/

NETWORK:
*

这个设置下离线访问正常，但在Firefox中更新不像我期望的那样工作。在Chrome和Safari中，当我更新index.php文件然后更改cache.manifest文件中的注释时，浏览器将获取新的index.php输出并将其用于缓存。然而，在Firefox中，它似乎不关心我是否已更新manifest.appcache文件。我怀疑如果我等待足够长的时间，它会进行更新，但我已经等了几个小时了。我要如何找到和解决我的缓存问题？

- Trott

2个回答

0

我知道我来晚了，但我多年来一直在Firefox中看到这个问题，并希望潜在的错误会得到修复。

不幸的是，这并没有发生，但我终于想出了一个解决方法。在我的情况下，虽然新的.appcache文件被加载和处理，但页面重新加载并不会使用新缓存的版本。我使用的过程如下：

加载index.html并在html标签中指定.appcache文件。
使用PHP脚本动态生成.appcache文件。该脚本对所有包含的文件进行哈希处理，以创建唯一版本哈希，并将其包含在清单中。这意味着清单中列出的任何文件的更改都会强制重新加载缓存。
我的.htaccess文件具有以下内容，以防止缓存.appcache清单：

<Files *.appcache> ExpiresActive On ExpiresDefault "access plus 0 seconds" </Files>
我的Javascript代码检测到appcache更新并在获取更新文件后重新加载页面：

appCache.addEventListener('updateready', function(e) { console.log("Appcache update finished, reloading..."); setLoadingBar(100, "Loading..."); appCache.swapCache(); location.reload(); });
页面重新加载后，在Firefox中仍然使用旧缓存，直到用户手动清除缓存。在我测试的所有其他浏览器中，新缓存的文件立即生效。

修复方法非常简单！

只需要改变 location.reload() 行并包含 true 参数即可。

location.reload(true)

这似乎表明Firefox从其正常缓存中提供文件，而不是使用存储的appcache文件，即使appcache文件更新。我猜测这是因为Firefox将普通缓存机制放在appcache之前，如下所示：

请求 -> 正常缓存 -> Appcache -> 网络请求

但这只是一个猜测。

- micwallace

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- robertc · Accepted Answer

你发送index.php文件时使用的HTTP缓存标头是什么？如果没有设置诸如Cache-control:和Expires:之类的标头，那么Firefox可能会从其常规缓存中刷新应用程序缓存版本的页面，而不是再次从服务器请求该页面。如果您想知道确切的操作步骤，可以参考这个回答以及http://www.diveintohtml5.info/offline.html上的内容，并将以下内容添加到.htaccess文件中。

<Files *.appcache>
    ExpiresActive On
    ExpiresDefault "access"
</Files>

希望这能帮助到下一个人！