通过javascript检测ipad/iphone webview

IT技术 javascript ipad ios webview
2021-01-12 03:20:05

有没有办法用 JavaScript 检测网站是在 iPad 的 Safari 内还是在应用程序 WebView 内运行?

6个回答

这里使用的组合window.navigator.userAgentwindow.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
};
@svlada 你能提供更多信息吗?您的设备及其 iOS 版本是什么?
2021-03-21 03:20:05
Safari 和 Telegram 在用户代理中都包含“safari”,所以这不起作用
2021-03-22 03:20:05
chromeSafari在 userAgent 中有。它在要求webcal://.ics 文件的协议方面表现不同
2021-03-28 03:20:05

用户代理

在 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);
@Razor 你是对的。在最新的 iOS 中测试而Version不是Safari为我工作。
2021-03-20 03:20:05
不适用于 iPhone 5s/iOS 7,因为它们UIWebView和 Safari 都Safari在他们的用户代理中
2021-03-30 03:20:05
@HenrikPetterson 关于用户代理字符串,比较上面的前两个用户代理字符串(UIWebView 和 iPad 上的 Safari),UIWebView 字符串包含 'version' 而 ipad 没有。您修改正则表达式的目标尚不清楚,听起来您可能正在寻求帮助编写正则表达式。
2021-04-01 03:20:05
@unceus 你能准确地概述一下你的意思Version吗?你替换SafariVersionvar is_uiwebview线?
2021-04-03 03:20:05
真的。我不知道为什么我首先自己查看了两个用户代理。感谢您的回答 :)
2021-04-08 03:20:05

我认为你可以只使用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;
Nicolas 目前的数字会有所不同因为 Safari 和 UIWebView(以及“独立”——即主屏幕——网络应用程序)使用不同的引擎。这在 iOS 5 中发生了变化。
2021-03-12 03:20:05
@Nicolas:没错,抱歉我没注意。我想知道是否有人可以确认iOS5中是否仍然如此?
2021-03-21 03:20:05
是的,但是您知道在 User-Agent 中是否有特定的字符串或其他东西可以检测 UIWebView 吗?到目前为止我找不到任何东西......
2021-03-30 03:20:05
我的意思不是数字,我的意思Safari/.....是 UIWebView 中缺少它本身
2021-03-31 03:20:05
这仅适用于 iOS 设备吗?
2021-04-04 03:20:05

我已经尝试了所有这些解决方案,但在我的情况下不起作用,
我打算检测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>
@БодровАндрей 我同意你的看法,但这是我能找到的唯一方法,我希望苹果将来为此提供不同的用户代理
2021-03-25 03:20:05
当心这在 iOS 13 上是 borken,因为如果使用桌面模式,那么navigator.platform === 'MacIntel'. 这尤其影响 iPadOS 13 Mobile Safari,因为它默认使用桌面模式。
2021-03-27 03:20:05
您不应该依赖这种技巧,因为用户或任何其他开发人员可以禁用电话检测。
2021-03-28 03:20:05
@robocat 你是对的。它在 iOS 13 iPad 中坏了,我现在没有解决方案。你能帮我解决这里的相关问题吗?stackoverflow.com/questions/58344491/...
2021-04-04 03:20:05

是的:

// 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);
@ThinkingStuff - 你能帮我区分一下 Mac OS(桌面浏览器)和 iPad Safari 浏览器吗 - stackoverflow.com/questions/58344491/...
2021-03-12 03:20:05
这将匹配 Safari 浏览器,不仅是 WebView。
2021-03-18 03:20:05