确定网站是作为 Web 应用程序打开还是通过 ipad 上的常规 safari 打开？答案

【问题标题】：Determine if site is open as web app or through regular safari on ipad?确定网站是作为 Web 应用程序打开还是通过 ipad 上的常规 safari 打开？
【发布时间】：2011-06-28 16:55:33
【问题描述】：

有没有办法确定访问者是在主屏幕上以网络应用程序的形式查看我们的网站，还是定期通过 ipad 上的 safari 浏览我们的网站？

【问题讨论】：

标签： ipad web-applications safari

【解决方案1】：

我想通了：

确保存在正确的网络应用元信息：

<head>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />

然后添加这个脚本

<script>
if (window.navigator.standalone == true) {
 document.write('<p>Welcome Home</p>');
}else{
 document.write('<p>Tap the + button and choose "Add to Home Screen"</p>');
 document.write('<link rel="apple-touch-icon-precomposed" href="icon@2x.png"/>');
}
</script>
</head>

因此，window.navigator.standalone 如果他们在全屏网络应用程序模式下查看，则为 true。超级棒。

来源：这是为 iphone 设计的，但它的工作原理是一样的，我想出了如何做到这一点：http://www.bennadel.com/blog/1950-Detecting-iPhone-s-App-Mode-Full-Screen-Mode-For-Web-Applications.htm

【讨论】：

感谢您回答您自己的问题！刚刚帮了我很多忙。
也许window.location.protocol == 'app:' 会更笼统和明确？

【解决方案2】：

我不确定这种行为可以追溯到多远，但 iOS 会向服务器显示不同的 UserAgent 字符串，这些字符串可用于检测网页是否正在由 web 应用程序或 safari 浏览器请求。

Safari 浏览器

Mozilla/5.0（iPhone；CPU iPhone OS 8_1_1，如 Mac OS X）AppleWebKit/600.1.4（KHTML，如 Gecko）版本/8.0 Mobile/12B436 Safari/600.1.4

主屏幕按钮/Web 应用程序

Mozilla/5.0（iPhone；CPU iPhone OS 8_1_1，如 Mac OS X）AppleWebKit/600.1.4（KHTML，如 Gecko）Mobile/12B436

请注意，它在 UserAgent 中不包含“Safari”。我已经确认这种行为至少可以追溯到 iOS 7，但我想更进一步。

【讨论】：

【解决方案3】：

如果您只寻找样式更改，您也可以使用媒体查询来获取最大高度为 700 像素。在 Safari 中屏幕高度为 660 像素，而在网络应用程序中为 740 像素（在横向模式下）。如果您的应用可以在任一方向上运行，您将需要一个高度/宽度组合。

【讨论】：