有没有办法用 JavaScript 检测网站是在 iPad 的 Safari 内还是在应用程序 WebView 内运行?
通过javascript检测ipad/iphone webview
IT技术
javascript
ipad
ios
webview
2021-01-12 03:20:05
6个回答
这里使用的组合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
};
用户代理
在 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);
我认为你可以只使用User-Agent
.
更新
使用 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);