移动 Safari 与主屏幕 webapp答案

【问题标题】：Mobile safari vs home-screen webapp移动 Safari 与主屏幕 webapp
【发布时间】：2011-08-28 06:25:37
【问题描述】：

我正在为 iOS 开发一个 web 应用程序，我注意到在移动 safari 上运行和从主屏幕运行之间存在一些奇怪的事情。

是否有任何资源可以提供用于在模式之间切换的通用接口？

如果没有，是否有任何资源详细说明了两种模式之间的所有差异和陷阱？

我遇到的事情：

长轮询有点奇怪。见this example。

window.innerWidth & window.innerHeight 不一致。

其他内容：

我发现this 和this 很有趣。

This question 还揭示了一些奇怪的行为。

【问题讨论】：

第一个错误示例非常适合我作为 iPad iOS 4.3 上的主屏幕应用程序。当你这样做时会发生什么？
@ampersand - 嗯，我猜它适用于 iPad 2（我刚刚在 v 4.3.2 上测试过），但适用于 iPod 4g（v.4.3.2）和 iPod 2g（v.4.2） .1）它不起作用（没有错误移动）。我已经卖掉了我的 iPod 1，但我认为它在那里也不起作用。重点是，作为主屏幕应用的浏览器与普通的移动 safari 不同。
FWIW，从主屏幕启动的网络应用程序使用与移动 safari (Nitro) 中使用的完全不同的 JavaScript 引擎。见theregister.co.uk/2011/03/15/…
@Matt Bridges- 是的，我想我在某处读到这是因为安全问题不允许浏览器外部的某些 API 访问。
已解决：stackoverflow.com/questions/2738766/…

【解决方案1】：

我认为 Apple 没有公开记录 iOS 中全屏 Web 应用程序的属性，因此您发现的任何内容都可能是轶事，因此在未来的版本中不够可靠，无法依赖。

您可能会更幸运地构建一个只有 UIWebView 呈现您的 Web 应用程序的应用程序。 iOS 应用程序的视图模式定义明确且有据可查，该应用程序可以提供您将来可能需要的其他功能（例如本地通知、后台执行、自定义 URL 处理程序）。

【讨论】：

嗯..这很蹩脚。我不能将我的应用程序放在应用程序商店（法律原因），而且我不想担心为不同平台维护不同的包。我想也许我运气不好？
看看网络应用程序上的WWDC 2011 session videos - 我没有参加任何这些会议，但 Apple 可能发布了一些对您有帮助的新信息。
我希望 Apple 在 iOS 5 中解决这个问题。我会继续为你的答案加分。
我将继续奖励赏金。这个问题没有 100% 解决，但似乎 iOS 5 是我最好的选择。我想我只会强迫我的用户将我的应用程序用作主屏幕应用程序，因此我只需为一个平台编写代码。

【解决方案2】：

使用时

<meta name="viewport" content="user-scalable = no, width = device-width" />

你会得到你的 window.innerWidth's!!!

使用时

<meta name="viewport" content="initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no, width = device-width" />

您将获得 >> 横向：1024 x 690 和纵向：768 x 946（'safari' 模式）

【讨论】：

【解决方案3】：

Apple 在主屏幕应用程序上支持四种选项：图标、启动画面、工具栏隐藏和设置状态栏模式。

【讨论】：

【解决方案4】：

如果您正在为移动设备构建应用程序，您可能需要查看Sencha Touch，它消除了管理移动设备细微差别的麻烦。

然后你可以在它旁边构建你的常规网络应用程序。

【讨论】：

好建议，但我认为它不适用于我的应用程序。我的应用程序不像普通的网络应用程序（没有屏幕转换、菜单等），只是一个画布、一些叠加层，并且画布总是需要保持可见。它基本上是地图软件。