sod*_*sod 87 javascript webview ipad ios
如果网站在ipad safari中运行或在应用程序WebView中运行,是否有办法通过javascript进行区分？
neo*_*eye 76
在UIWebView中运行
Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/98176
在iPad上运行Safari
Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9B176 Safari/7534.48.3
在Mac OS X上运行Safari
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_3) AppleWebKit/534.55.3 (KHTML, like Gecko) Version/5.1.5 Safari/534.55.3
在Mac OS X上运行Chrome
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_3) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.151 Safari/535.19
在Mac OS X上运行FireFox
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.7; rv:11.0) Gecko/20100101 Firefox/11.0
var is_uiwebview = /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(navigator.userAgent);
var is_safari_or_uiwebview = /(iPhone|iPod|iPad).*AppleWebKit/i.test(navigator.userAgent);
Thi*_*iff 74
这里使用的组合window.navigator.userAgent和window.navigator.standalone.它可以区分与iOS网络应用程序相关的所有四种状态:safari(浏览器),独立(全屏),uiwebview,而不是iOS.
演示:http://jsfiddle.net/ThinkingStiff/6qrbn/
var standalone = window.navigator.standalone,
userAgent = window.navigator.userAgent.toLowerCase(),
safari = /safari/.test( userAgent ),
ios = /iphone|ipod|ipad/.test( userAgent );
if( ios ) {
if ( !standalone && safari ) {
//browser
} else if ( standalone && !safari ) {
//standalone
} else if ( !standalone && !safari ) {
//uiwebview
};
} else {
//not iOS
};
Nic*_*s S 10
我认为你可以使用User-Agent.
UPDATE
使用iPhone Safari浏览的页面
Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version/4.0.5 Mobile/8B117 Safari/6531.22.7
我将尝试使用UIWebView
Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Mobile/8B117
不同之处在于Safari的说法 Safari/6531.22.7
解
var isSafari = navigator.userAgent.match(/Safari/i) != null;
我已经尝试了所有这些解决方案，但在我的情况下不起作用，
我打算检测Telegram 中的 Webview 。我认为它使用SFSafariViewController.
我注意到 Safari 应用程序将所有手机样式文本更改为带有“tel:”前缀的链接，但 webview 没有。
所以，我用了那个。
在这里测试：jsfiddle
<!DOCTYPE html>
<html>
<head></head>
<body>
<ul id="phone" style="opacity:0">
<li>111-111-1111</li>
</ul>
</body>
</html>
<script>
var html = document.getElementById("phone").innerHTML;
if (navigator.platform.substr(0,2) === 'iP') {
if (html.indexOf('tel:') == -1)
alert('not safari browser');
else
alert('safari browser');
}
else
alert('not iOS');
</script>
是啊:
// is this an IPad ?
var isiPad = (navigator.userAgent.match(/iPad/i) != null);
// is this an iPhone ?
var isiPhone = (navigator.userAgent.match(/iPhone/i) != null);
// is this an iPod ?
var isiPod = (navigator.userAgent.match(/iPod/i) != null);
更新
测试日期：2023 年 4 月，iOS 16。
演示页面：https://milen-yordanov.github.io/detect-ios-webview/index.html
请参阅： https: //github.com/milen-yordanov/detect-ios-webview
现在是 2022 年，Safari 版本是 15.4。上述解决方案都不适合我。iOS 上有两个 webview 类：WKWebView 和 SFSafariViewController。SFSafariViewController 具有与 Safari 相同的 userAgent。我提出的解决方案依赖于height: 100vhMobile Safari 上的处理方式。100vh 是设备屏幕高度，而不是文档可见高度。
欲了解更多信息，请参阅：
https://developers.google.com/web/updates/2016/12/url-bar-resizing
https://bugs.webkit.org/show_bug.cgi?id=141832
https://github.com/bokand/URLBarSizing
因此，在 iOS 上，这样的函数会检测 WebView 模式。
function isWebView()
{
const htmlEl = document.getElementsByTagName('html')[0];
const bodyEl = document.getElementsByTagName('body')[0];
const oldHtmlHeight = htmlEl.style.height;
const oldBodyHeight = bodyEl.style.height;
htmlEl.style.height = "100vh";
bodyEl.style.height = "100%";
const webViewMode = document.documentElement.clientHeight === document.documentElement.scrollHeight;
// restore height
htmlEl.style.height = oldHtmlHeight;
bodyEl.style.height = oldBodyHeight;
return webViewMode;
}
| 归档时间： |
|
| 查看次数： |
79109 次 |
| 最近记录： |