HTML5 中的应用程序缓存不起作用：答案

【问题标题】：Application cache in HTML5 not working:HTML5 中的应用程序缓存不起作用：
【发布时间】：2012-06-24 21:44:38
【问题描述】：

我是 HTML 5 应用程序存储的新手。我正在尝试一个样本来测试离线存储。我有几个问题。请帮忙。

使用的文件：

index.html

<html manifest="demo.manifest"> 
<head> 
<link rel="stylesheet" href="style.css" type="text/css" /> 
<script type="text/javascript" src="script.js" ></script>
</head> 
<body> 
<h1>some text</h1> 
<p>Some text.</p> 
</body> 
</html>

style.css

body{background-color: #333;}
h1{color: #c94054;}
p{color: #fff;}

demo.manifest

CACHE MANIFEST

CACHE:
style.css
index.html

我知道 demo.manifest MIME 类型必须设置为 text/cache-manifest 并且必须在 *.htaccess 文件中完成。我在 Windows 环境中使用 apache tomcat 6.0 服务器。我无法在服务器中找到此文件。因此，我在我的项目（正在 eclipse helios 上开发）的根目录中创建了一个（test.htaccess），即在 d:/eclipse-workspace/ProjectName/ 中，我的文件如下所示：

test.htaccess

AddType text/cache-manifest .manifest

但是当我停止服务器并尝试访问它时，应用程序缓存不起作用，如下所示：

http://localhost:8081/ProjectName/index.html

请让我知道我做错了什么...另外，有没有办法调试应用程序缓存

【问题讨论】：

标签： html

【解决方案1】：

我遇到了同样的问题。一切看起来都正确：路径正确，清单在我的项目中，我可以手动浏览它，设置了 MIME 类型。它根本没有试图从我的 HTML 中获取这个文件。问题是我没有在清单的开头包含所需的行：

CACHE MANIFEST

没有这个会导致浏览器默默地忽略清单标签。

【讨论】：

【解决方案2】：

在 Tomcat 服务器上，MIME 类型通过默认的 web.xml 文件conf/web.xml进行配置

在该文件的末尾，您会发现一堆已定义的 MIME 类型。你必须添加

<mime-mapping>
    <extension>manifest</extension>
    <mime-type>text/cache-manifest</mime-type>
</mime-mapping>

相当于您放入 .htaccess 中的内容，供 Apache 和其他服务器使用。

【讨论】：

嗨..感谢您的信息。我已经这样做了，但我仍然在 Google Chrome 错误日志中收到以下错误（通过 ctrl+shift+J 打开浏览器日志）“应用程序缓存错误事件：无效的清单 mime 类型（）”
@user1475068 首先检查 Chrome 开发人员工具 - 网络选项卡中究竟传输了什么（尤其是 mime 类型）。还要检查stackoverflow.com/questions/7375514/…，因为我认为这是一个相关问题。也许是一个愚蠢的问题，在将 MIME 类型添加到其中心 web.xml 后，您是否重新启动了 Tomcat？
嗨...我检查了网络选项卡，我可以看到 .css、.html 和 .js 文件，但看不到我的 .manifest 文件。在测试它之前，我也重新启动了服务器。此外，在您所说的帖子中，错误消息在括号内显示“文本/纯文本”，但在我的帖子中它只是空的。 .htaccess 文件在 Windows 中的正确位置是什么。我必须在其他地方引用这个文件吗？请帮忙....
嗨..最后，我得到了这个工作。我将缓存清单文件的扩展名从 .manifest 更改为 .appcache，现在它可以正常工作了。感谢您的帮助和建议。
@user1475068 很高兴能帮您解决问题，祝您项目顺利！