iOS“Web App”具有与Mobile Safari不同的localStorage

前端之家收集整理的这篇文章主要介绍了iOS“Web App”具有与Mobile Safari不同的localStorage前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个webapp的iPad与元标记
<Meta name="apple-mobile-web-app-capable" content="yes">

当我从主页(web-app-capable版本)打开应用程序或在Mobile Safari中输入地址时,localStorage的内容是不同的.我已经确认地址是通过打印location.href相同的.

在使用移动Safari浏览器时对localStorage所做的所有更改均反映在支持网络应用的版本中,但是可以在Web应用程序中进行的更改不会反映在Mobile Safari版本中.

域名是相同的,localStorage应该是一样的.世界上发生了什么?这可以解决吗?

更新 – 解决方案:从接受的答案(强制用户进入全屏模式),按照建议#2,我添加了这一段代码

if(("standalone" in window.navigator) && !window.navigator.standalone)
    window.location = "instructions.html";

因此,如果您正在使用支持独立模式的浏览器,并且您不处于独立模式,请重定向页面(instructions.html),该页面显示用户如何将应用程序添加到主屏幕.

感谢大家的投入!

解决方法

概要:

Safari和全屏网络应用程序(a.k.a. web-app功能)具有单独的内存写入本地数据缓存.每当全屏应用变为活动状态时,它会从磁盘重新加载localStorage(允许它查看Safari的更改).但是,当Safari变为活动状态时,它不会从磁盘重新加载localStorage数据,因此除非您杀死Safari并重新启动Safari,否则它不会在全屏应用程序中看到更改.

完整说明:

计算机科学只有两个难题:

>缓存无效
命名事物
>一个一个的错误

localStorage中的错误行为是问题#1的结果.这就是为什么:

当iOS浏览器引擎加载时,它从磁盘读取localStorage的数据并将其缓存在内存中.然后每次读取数据(例如getItem)时,数据从内存中读取,而不是从磁盘读取;并且当写入(例如setItem)时,将数据写入存储器,然后(异步地)刷新到磁盘.由于localStorage是同步的,所以这个实现是完全合理的.如果它进入磁盘进行所有读写操作,您的JavaScript将在每次读/写操作时被阻止执行昂贵的磁盘IO.

问题是,全屏网络应用程序(让我们称之为FSWA)使用iOS浏览器引擎的单独实例,虽然FSWA在本地磁盘上共享相同的位置,但它并不共享内存中的缓存的Safari的localStorage数据.

当您添加FSWA完全重新加载(这意味着localStorage数据从磁盘重新加载)的事实,每当它们成为活动应用程序时,您会收到您看到的行为.

这是幕后的…

>用户在Safari中将数据写入localStorage进行更改
Safari将数据写入Safari的内存中的localStorage缓存
> Safari将localStorage数据从缓存刷新到磁盘
>用户离开野生动物园并启动FSWA
> FSWA加载并将diskStorage数据从磁盘读取到内存缓存中
>用户可以看到Safari中已更改的数据(在步骤#1中)
>用户在将数据写入localStorage的FSWA进行更改
> FSWA将数据写入其localStorage缓存(Safari的缓存未更新)
> FSWA将其localStorage缓存数据刷新到磁盘
>用户切换回Safari
> Safari已经在运行,它不会从disk重新加载localStorage数据
Safari从现有的内存缓存中读取旧数据
>用户没有看到步骤#7中所做的更改

为了证明这一点,您可以在步骤#4和步骤#10之间进行kill Safari.然后,当您在步骤11中重新启动Safari时,将从磁盘重新加载localStorage,您将看到FSWA写入的数据.

猜你在找的iOS相关文章