Question

我正在为iphone的移动网站工作。我添加了一个缓存清单，并为其添加了脱机功能所需的资源列表。清单文件具有正确的内容类型。如果查看文件的响应标头，则内容类型为text / cache-manifest。清单文件在这里：

http://hoodisgood.clientsit.es/cache.manifest

此处可以查看该网站（您需要查看您的iphone（或模拟器）或Safari，并将用户代理设置为iPhone。

http://hoodisgood.clientsit.es/

查看网站并将其添加到主屏幕后，我将iphone设置为飞行模式，当我尝试查看网站时，我不能。我得到一个警告，它无法打开，因为它没有连接到互联网。我已经在缓存清单文件中指定了脱机操作所需的所有文件。

另外，如果我错了，请更正我，但是使用缓存清单，即使设备在线，浏览器也不应该从缓存源中读取？当我查看该网站时，我没有看到的照片是从服务器加载的，应该是这样。当我关闭并重新打开时，之前查看的图像仍然从服务器加载。

我做错了吗？我检查并重新检查，一切似乎都是正确的，只是不确定为什么它不起作用。

感谢。

Answer 1

我注意到你的标签没有引用清单。

<html manifest="cache.manifest">

此外，您需要确保清单文件使用“text / cache-manifest”mime类型。

还要确保清单具有UTF-8编码，而不是浏览器很难理解的某些编码。

另外，我建议您在Chrome中加载网站。如果您在Chrome中查看开发者日志，则Chrome会写出非常有用的错误消息，指导您解决问题所在。

Answer 2

我注意到你的标签没有引用清单。

<html manifest="cache.manifest">

此外，您需要确保清单文件使用“text / cache-manifest”mime类型。

Answer 3

我遇到了类似的问题：

尝试在清单文件中引用绝对路径。这对我来说很有用，我也在使用子域名。

还可以在Safari中启用开发人员控制台并添加以下JS

function logEvent(event) {
  console.log(event.type);
}
window.applicationCache.addEventListener('checking', logEvent, false);
window.applicationCache.addEventListener('noupdate', logEvent, false);
window.applicationCache.addEventListener('downloading', logEvent, false);
window.applicationCache.addEventListener('cached', logEvent, false);
window.applicationCache.addEventListener('updateready', logEvent, false);
window.applicationCache.addEventListener('obsolete', logEvent, false);
window.applicationCache.addEventListener('error', logEvent, false);

像这样，您可以检查浏览器中缓存清单的相关内容，并了解是否发生错误。

离线无法在具有缓存清单的移动Safari中工作

3 个答案: