主屏幕持久性上的iPhone WebApp

时间:2011-11-02 13:33:59

标签: javascript android iphone html5 web-applications

我创建了一个可以保存到iPhone上“主屏幕”的webapp。该应用程序使用画布,并且在改变状态时具有相当的交互性。

每当应用程序最小化并重新打开时,它将重置为初始状态。关闭应用程序并重新加载它时会发生相同的(如预期的那样)。

  1. 如果仅将应用最小化,我该如何阻止重新加载?

  2. 保持状态数据的最佳方式是什么,以便在应用程序出现时 关闭并重新打开它继续无缝?

  3. 我需要使用哪些事件来确保状态数据不会丢失?

  4. 如果可能,跨平台解决方案将是首选的iPhone + Android ...

4 个答案:

答案 0 :(得分:8)

TL; DR 您需要将应用程序设计为使用本地存储或cookie或其他一些可以保留状态的机制。它需要查看本地存储并在每次启动时重建它的界面。使用本地存储或webdb(折旧但受支持),您需要保存每个状态更改,并确保在页面加载到浏览器时重新加载它们。

  1. 定义最小化?在后台运行?

    您的网络应用程序,无论其在主屏幕上的状态如何,都只是加载到浏览器中的另一个页面。由于a)设备内存不足以及b)多任务处理如何工作,操作系统可以要求应用程序释放内存,甚至可以随时终止自己。

    这就是为什么当你构建一个iOS应用程序时,你有:

    - (void)applicationWillTerminate:(UIApplication *)application

    此方法允许您作为开发人员在应用程序终止时从操作系统接收终止信号时指定要使用的行为(如保存用户数据)。这也是iOS开发人员指南要求您保留状态并始终确保在将应用程序带到前台时恢复状态的原因。 (当您双击主页时,用户可能不知道应用已终止,因为它仍然会出现在“正在运行的应用程序”列表中。)

    现在我知道你在谈论一个网络应用程序,但这很重要。网页,我也很确定你的,在手机中占用一些内存 - 你有DOM,所有资源,关于状态的信息,关于页面的位置以及哪些小部件被设置为什么。你说你的应用程序使用画布和东西是相当互动的 - 我确信它占用了大量的内存。

    因此,当您将Safari置于后台时,Safari很可能会破坏您的内存缓存。

  2. Safari可以访问本地存储和cookie数据。 iOS5也可以访问WebSQL(但没有IndexedDB因为WebSQL被折旧而感到难过)。选择你的毒药。

  3. 您需要始终保存状态。由于您无法通过JS访问UIApplicationDelegate方法,因此每次用户执行某些操作时,您都需要保存该状态更改。每次重新加载页面时,都需要检查持久状态并从您选择的存储选项重新加载。

答案 1 :(得分:1)

如果使用localStorage API保存当前状态并在加载时从此API恢复,则应该能够重新创建应用程序状态。

我推荐此页面以获取本地存储API的概述:http://diveintohtml5.info/storage.html

我担心你在后台处理内存中的应用程序/网页时会遇到问题,但是在加载页面时会持续将状态存储到localStorage并恢复状态(window.onload或$(document).ready ())将是一个解决方案。

答案 2 :(得分:0)

  1. 我认为你不能
  2. WebKit支持HTML5客户端数据存储,您可以使用
  3. 我不知道您的webApp在关闭时会收到通知的任何方式,因此您应该尝试在导航等的每个步骤之后保存当前状态(Background behavior for iOS Web App (so app doesn't restart))。

答案 3 :(得分:0)

如果您的应用程序仅使用canvas进行渲染,那么您可以将函数绑定到window.unload或pagehide事件,无论何时卸载页面,该函数都会使用

捕获画布的像素数据。
ctx.getImageData()
  • 并将其存储在localstorage中,然后在重新加载页面时,您可以将该数据直接推送到画布上以进行即时重新加载,并在您加载实际应用程序时将微调器置于顶部。