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

前端之家收集整理的这篇文章主要介绍了在iOS中添加到主屏幕时,HTML5网络应用不缓存前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
要清楚,Web应用程序是缓存,并在Mobile Safari中脱机工作.

问题是当它被添加到iPhone 4s和iPad 2的主屏幕上,两者都运行iOS 6.0.1.它不会离线工作,并且连接到互联网时出现网络错误,即“无法打开MYWEBAPP.MYWEBAPP无法打开,因为它没有连接到互联网”

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

我已经在桌面Safari,Chrome和Firefox的开发人员工具在线/离线测试了该应用程序.以及Web Inspector与Safari中的设备. iPhone或iPad上的结果是一样的.他们将缓存网络应用程序,并且可以在移动Safari中工作,但在添加到主屏幕时不会.离线或在线都没有任何错误.

据我所知,我正在使用最佳做法:

>添加了HTML标题:< html manifest =“photo.appcache”>

我也尝试过使用不同的名称显示清单文件,其中包括:cache.manifest和offline.manifest,因为我看到它有所不同,但在我的测试中,只要扩展名是什么名字就没关系. manifest或.appcache,并在.htaccess文件中适当地提供.
添加正确的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 appcache manifest

就像HTML5 Mobile Boilerplate中的内容一样.
>已添加

网络:
*

到appcache文件.我相信这样可以让所有的内容都下载,同时使所有链接都可以正常工作.

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

我几乎把它缩小为iOS 6中的一个错误(我实际上使用的是iOS 6.0.1),因为我知道现在已经在浏览器中将数据分离出来,而添加到主屏幕中的数据.我在这里发布这个问题,看看有没有其他开发人员遇到同样的问题.

解决方法

我已经解决了这个问题.我在iOS 6中为主屏幕网络应用程序推荐以下内容.

为了测试目的,请使用Web Inspector和一个不错的JS脚本,如Jonathan Stark’s,知道应用程序在Mobile Safari中的缓存时间:

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

成功缓存后,将应用程序添加到主屏幕,并将其打开,以便分开缓存主屏幕版本.它必须完全缓存才能使其脱机工作.

由于我的应用程序缓存是22mb的数据,并且数据缓存是针对web应用程序的SEPARATE,所以我遇到的问题是没有离开主屏幕应用程序打开足够长的时间来缓存.

用户体验而言,这是可怕的,但数据也是分开的.我可以确认这一点,因为如果您从Safari中删除网站数据,则主屏幕网络应用程序仍将起作用.

据我所知,没有办法调试主屏幕Web应用程序缓存的数据,或存储在哪里.

猜你在找的iOS相关文章