ios - 在 iOS 中添加到主屏幕时,HTML5 网络应用程序不缓存

标签 ios web-applications mobile-safari manifest offline-caching

需要说明的是,该 Web 应用程序正在缓存并且在 Mobile Safari 中离线运行良好。

问题是当它被添加到运行 iOS 6.0.1 的 iPhone 4s 和 iPad 2 的主屏幕时。它不会脱机工作并给出连接到互联网的网络错误,即“无法打开 MYWEBAPP。无法打开 MYWEBAPP,因为它未连接到互联网”

我已经调试了几个小时,但似乎找不到解决方案。我在控制台中没有收到任何错误,我正在运行 Jonathan Stark 的 debugging code

我已经在桌面 Safari、Chrome 和 Firefox 的开发人员工具中在线/离线测试了该应用程序。以及带有 Safari 设备的 Web Inspector。结果在 iPhone 或 iPad 上都是一样的。它们都将缓存 Web 应用程序并在 Mobile Safari 中工作,但在添加到主屏幕时不起作用。离线或在线都没有错误。

据我所知,我正在使用最佳实践:

  1. 添加了 HTML header :<html manifest="photo.appcache">

    我还尝试过为 list 文件使用不同的名称,包括:cache.manifest 和 offline.manifest,因为我读到它有所不同,但在我的测试中,名称是什么并不重要,只要扩展名是 .manifest 或 .appcache,并在 .htaccess 文件中适当提供。

  2. 添加了正确的 MIME 类型:AddType text/cache-manifest appcache manifest

    我也试过:AddType text/cache.manifest manifest , AddType text/cache.manifest .manifest manifest , AddType text/cache-manifest .manifest

    我认为这行不通:AddType text/cache.manifest但我不记得了。在大多数情况下,这并不重要,我坚持使用:

    AddType text/cache-manifest 应用缓存 list

    因为那是 HTML5 移动样板中的内容。

  3. 添加:

网络: *

到应用程序缓存文件。我相信这允许下载所有内容并使所有链接都有效。

  1. 我试过删除这一行:<meta name="apple-mobile-web-app-capable" content="yes"> 因为我在 SO 上读到这里解决了一个类似于我的问题,但我可以确认它在我的测试中不起作用。在按下主屏幕图标时删除此行或将内容设置为“否”将重定向到 Mobile Safari 而不是打开全屏。

我已经把它缩小到它是 iOS 6 中的一个错误(我实际上使用的是 iOS 6.0.1),因为我知道现在已经将浏览器中的网络应用程序和添加到主屏幕。我在这里发布这个问题是为了看看是否有任何其他开发人员遇到了同样的问题。

最佳答案

我已经解决了这个问题。对于 iOS 6 中的主屏幕网络应用程序,我推荐以下内容。

出于测试目的,使用 Web Inspector 和一个不错的 JS 脚本(如 Jonathan Stark 的)来了解应用程序何时缓存在 Mobile Safari 中:

http://jonathanstark.com/blog/debugging-html-5-offline-application-cache?filename=2009/09/27/debugging-html-5-offline-application-cache/

成功缓存后,将应用程序添加到您的主屏幕并保持打开状态,以便单独缓存主屏幕版本。它必须完全缓存才能脱机工作。

由于我的应用程序缓存是 22mb 的数据,并且数据缓存对于网络应用程序是单独的,所以我遇到的问题是没有让主屏幕应用程序打开足够长的时间来进行缓存。

就用户体验而言,这很糟糕,但数据是分开的也很好。我可以确认这一点,因为如果您从 Safari 中删除网站数据,主屏幕网络应用程序仍然可以运行。

据我所知,没有办法调试为主屏幕网络应用程序缓存的数据或数据的存储位置。

关于ios - 在 iOS 中添加到主屏幕时,HTML5 网络应用程序不缓存,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13302501/

相关文章:

javascript - 如何为 iOS 5+ 打开新窗口

ios - 在节点模块中对 native 重建 .bin 文件夹使用react

ios - 这是一个错误吗?或者匿名用户的工作流程是否有所不同?

ios - Swift 3 构建数组(不知道如何描述)

javascript - 与用于 Web 应用程序开发的服务器端对象的两种方式通信

php - 如何在请求之间保留 MongoDB 游标?

ios - 如何将 NSTextView 从 nib 链接到 windowController?

angularjs - 使用 Angular 和 Laravel 作为 Web 应用程序的后端有多普遍?

HTML、CSS 动画 : floating on iphone safari not like in other browsers

javascript - 在 Mobile Safari 上播放声音?