Question

我正在尝试使用简单的html5网络摄像头。

这是我唯一的html页面，index.html：

<!DOCTYPE HTML>

<html manifest="./main.manifest">
  <body>
    <p>Hi.</p>
  </body>
</html>

这是我唯一的缓存文件，main.manifest：

CACHE MANIFEST
# 2011-05-02-03

index.html

我正在运行apache共享主机，我在我的web目录中放了一个.htaccess文件，其中这两个文件是，因为我想也许我必须定义mime类型：

AddType text/cache-manifest .manifest

所以最后我只在这个目录中有这三个文件：

index.html
main.manifest
.htaccess

当我从我的mac访问chrome页面，从我的iphone访问chrome或从我的android 2.3设备访问chrome时，没有任何反应，页面就像往常一样加载。如果我打开飞机模式（终止所有连接），则无法加载页面（因此我猜缓存失败）。

我在这里缺少什么？

由于

------------更新------------------

我认为mime类型无法正确识别。我将.htaccess更新为：

AddType text/cache-manifest manifest

现在，如果我在控制台上运行谷歌浏览器，我会看到：

Document was loaded from Application Cache with manifest
http://example.com/foo/main.manifest
Application Cache Checking event
Application Cache NoUpdate event

当我加载关于想要让我将它存储到磁盘的网站的页面时，Firefox会提示我，所以这很好。看起来它也在使用android 2.3.4。浏览器仍然显示“由于您没有连接到互联网，因此无法加载此页面”，但无论如何它都会加载。

谢谢！

Answer 1

首先，你是第一次使用mime类型声明。它应该是这样的：

AddType text/cache-manifest .manifest

接下来，请阅读Dive Into HTML5：

中的这一段

问：我是否需要在缓存清单中列出我的HTML页面？

答：是的，不是。如果您的整个Web应用程序包含在一个中   页面，只需确保页面指向缓存清单使用   清单属性。导航到带有清单的HTML页面时   属性，页面本身被假定为Web的一部分   应用程序，因此您无需在清单文件本身中列出它。   但是，如果您的Web应用程序跨越多个页面，则应列出   清单文件中的所有HTML页面，否则是浏览器   不知道还有其他HTML页面需要   下载并缓存。

因此，在这种情况下，您不需要缓存清单。浏览器将自动缓存您的页面（只要它是唯一的资源，例如CSS文件或Javascript文件）。

有关详情，请访问上面的链接。

Answer 2

我在清单中使用“显式缓存”项目时遇到了一些麻烦，所以我通常会这样设置：

CACHE MANIFEST
# 2011-05-02-03

CACHE:
index.html

但另一个答案是正确的，浏览器会自动缓存包含应用程序缓存清单的任何URL。

我建议使用Chrome的JavaScript控制台 - 它会在发生时输出应用程序缓存事件，包括错误。

无法获得简单的html5清单缓存工作！

2 个答案: