Fatal编程技术网
  • ipad/
  • 确定网站是作为web应用程序还是通过ipad上的常规safari打开的？

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

ipad web-applications safari

确定网站是作为web应用程序还是通过ipad上的常规safari打开的？,ipad,web-applications,safari,Ipad,Web Applications,Safari,有没有办法确定访问者是在主屏幕上以web应用程序的形式查看我们的网站，还是定期通过ipad上的safari查看我们的网站？我想： 确保存在正确的web应用元信息： <head> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> 然后添加这个脚本 &

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

我想：

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

<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> 


if（window.navigator.standalone==true）{
文件。写（“欢迎回家”
”）；
}否则{
文档。写入（“点击+按钮并选择“添加到主屏幕”
”）；
文件。写（“”）；
}
因此，
window.navigator.standalone
在全屏web应用模式下查看时将为真。太好了

来源：这是针对iphone的，但它的工作原理是一样的，这也是我找到方法的地方：

如果你只想改变样式，你也可以使用媒体查询来查询700px的最大高度。在safari中，屏幕高度为660px，而在web应用中，屏幕高度为740px（在横向模式下）。如果你的应用程序在两个方向都工作，你需要一个高度/宽度组合。

我不确定这种行为发生的时间有多远，但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，但我可以想象得更远。

感谢您回答自己的问题！刚才帮我解决了堆问题。也许
window.location.protocol==“app:”
会更一般、更明确？