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

Question

我有一个带有meta标签的iPad webapp:

<meta name="apple-mobile-web-app-capable" content="yes">

当我从主页(支持Web应用程序的版本)打开应用程序或在Mobile Safari中输入地址时,localStorage的内容会有所不同.我已通过打印location.href确认地址相同.

使用Mobile Safari时对localStorage所做的所有更改都反映在支持Web应用程序的版本中,但在支持Web应用程序的版本中所做的更改不会反映在Mobile Safari版本中.

域名是相同的,localStorage应该是相同的.世界上到底发生了什么？这可以修复吗？

---

更新 - 解决方案:根据接受的答案提示#2(强制用户处于全屏模式),我添加了以下代码:

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

所以,如果你使用的是支持单机模式下的浏览器,你是不是在独立模式下,重定向到一个页面(instructions.html),这显示了用户如何将应用程序添加到主屏幕.

感谢大家的投入!

Answer 1

摘要:

Safari和全屏Web应用程序(也称为支持Web应用程序)具有localStorage数据的单独内存中直写高速缓存.每次全屏应用程序变为活动状态时,它都会从磁盘重新加载localStorage(允许它查看Safari的更改).但是,当Safari变为活动状态时,它不会从磁盘重新加载localStorage数据,因此除非您杀死Safari并重新启动它,否则它不会看到全屏应用程序中所做的更改.

完整说明:

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

1. 缓存失效
2. 命名的东西
3. 一个一个错误

localStorage中的错误行为是问题#1的结果.原因如下:

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

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

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

这是幕后的......

1. 用户进行更改,将数据写入Safari中的localStorage
2. Safari将数据写入Safari的内存中localStorage缓存
3. Safari将localStorage数据从缓存刷新到磁盘
4. 用户离开safari并启动FSWA
5. FSWA从磁盘加载和读取localStorage数据到内存缓存中
6. 用户可以在Safari中查看已更改的数据(步骤1中)
7. 用户在将数据写入localStorage的FSWA中进行更改
8. FSWA将数据写入其localStorage缓存(Safari的缓存未更新)
9. FSWA将其localStorage缓存数据刷新到磁盘
10. 用户切换回Safari
11. Safari已在运行,并且它不会从磁盘重新加载localStorage数据
12. Safari从其现有的内存缓存中读取旧数据
13. 用户未看到步骤#7中所做的更改

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

Answer 2

在iOS5中,我能够在同一个域中拥有两个能够看到彼此的localStorage的全屏Web应用程序.这克服了全屏和Safari之间的差异.

但是,对于iOS6,我必须将我的两个全屏网络应用程序合并到一个应用程序.