Question

我有一个应用，我想根据用户导航的位置将用户重定向到不同的网页。

如果从网络剪辑导航，请勿重定向。如果从移动Safari导航，请重定向到safari.aspx。如果从其他任何地方导航，请重定向到unavailable.aspx

我能够使用iPhone WebApps, is there a way to detect how it was loaded? Home Screen vs Safari?来确定用户是否从网络剪辑导航，但我无法确定用户是否在iPhone或iPod上从移动版Safari导航。

这就是我所拥有的：

if (window.navigator.standalone) {
    // user navigated from web clip, don't redirect
}
else if (/*logic for mobile Safari*/) {
    //user navigated from mobile Safari, redirect to safari page
    window.location = "safari.aspx";
}
else {
    //user navigated from some other browser, redirect to unavailable page
    window.location = "unavailable.aspx";
}

Answer 1

请参阅https://developer.chrome.com/multidevice/user-agent#chrome_for_ios_user_agent - iOS上的Safari和iOS上的Chrome的用户代理字符串不太相似：

铬

Mozilla/5.0 (iPhone; U; CPU iPhone OS 5_1_1 like Mac OS X; en) AppleWebKit/534.46.0 (KHTML, like Gecko) CriOS/19.0.1084.60 Mobile/9B206 Safari/7534.48.3

Safari浏览器

Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543 Safari/419.3

看起来这里最好的方法是首先检查iOS，因为其他答案已经建议，然后过滤使Safari UA独特的东西，我建议最好用＃34; AppleWebKit和不是CriOS＆＃34;：

var ua = window.navigator.userAgent;
var iOS = !!ua.match(/iPad/i) || !!ua.match(/iPhone/i);
var webkit = !!ua.match(/WebKit/i);
var iOSSafari = iOS && webkit && !ua.match(/CriOS/i);

Answer 2

最佳做法是：

function isMobileSafari() {
    return navigator.userAgent.match(/(iPod|iPhone|iPad)/) && navigator.userAgent.match(/AppleWebKit/)
}

Answer 3

更新：这是一个非常古老的答案，我无法删除它，因为答案已被接受。检查unwitting's answer below以获得更好的解决方案。

您应该能够检查user agent字符串中的“iPad”或“iPhone”子字符串：

var userAgent = window.navigator.userAgent;

if (userAgent.match(/iPad/i) || userAgent.match(/iPhone/i)) {
   // iPad or iPhone
}
else {
   // Anything else
}

Answer 4

下降的代码只能找到移动游猎，而不是其他任何东西（除了海豚和其他小型浏览器）

  (/(iPad|iPhone|iPod)/gi).test(userAgent) &&
  !(/CriOS/).test(userAgent) &&
  !(/FxiOS/).test(userAgent) &&
  !(/OPiOS/).test(userAgent) &&
  !(/mercury/).test(userAgent)

Answer 5

合并所有答案和评论。这就是结果。

function iOSSafari(userAgent)
{
    return /iP(ad|od|hone)/i.test(userAgent) && /WebKit/i.test(userAgent) && !(/(CriOS|FxiOS|OPiOS|mercury)/i.test(userAgent));
}



var iOSSafari = /iP(ad|od|hone)/i.test(window.navigator.userAgent) && /WebKit/i.test(window.navigator.userAgent) && !(/(CriOS|FxiOS|OPiOS|mercury)/i.test(window.navigator.userAgent));

Answer 6

查看所有答案，以下是有关拟议的RegExes的一些提示：

AppleWebKit也与Desktop Safari相匹配（不仅仅是移动版）
对于这样的简单正则表达式，不需要多次调用.match，并且更喜欢较轻的.test方法。
g（全局）正则表达式标志无效，而i（不区分大小写）可能有用
不需要捕获（括号），我们只是测试字符串

我只是使用此功能，因为获取移动版Chrome true对我来说没问题（相同行为）：

/iPhone|iPad|iPod/i.test(navigator.userAgent)

（我只想检测设备是否是iOS应用的目标）

Answer 7

实际上，没有检测到移动野生动物园的银弹。有不少浏览器可能会使用移动Safari的用户代理的关键字。也许您可以尝试功能检测并不断更新规则。

Answer 8

我赞成@unwitting的回答，因为它不可避免地让我走了。但是，在iOS Webview中渲染我的SPA时，我需要稍微调整一下。

function is_iOS () {
    /*
        Returns whether device agent is iOS Safari
    */
    var ua = navigator.userAgent;
    var iOS = !!ua.match(/iPad/i) || !!ua.match(/iPhone/i);
    var webkitUa = !!ua.match(/WebKit/i);

    return typeof webkit !== 'undefined' && iOS && webkit && !ua.match(/CriOS/i);
};

主要区别在于，将webkit重命名为webkitUa，以防止与用作SPA和＆amp;之间的消息处理程序的根webkit对象发生冲突。的UIView。

Answer 9

function isIOS {
  var ua = window.navigator.userAgent;
  return /(iPad|iPhone|iPod).*WebKit/.test(ua) && !/(CriOS|OPiOS)/.test(ua);
}

Answer 10

我知道这是一个老话题，但我想与你们分享我的解决方案。

我需要检测用户何时从Desktop Safari导航（因为我们在2017年中期，并且Apple没有对input[type="date"] YET提供任何支持...

所以，我为它做了一个后备自定义日期选择器）。但仅适用于桌面中的safari，因为该输入类型在移动Safari中运行良好。所以，我让这个正则表达式只检测桌面Safari。我已经测试过，它与Opera，Chrome，Firefox或Safari Mobile不匹配。

希望它可以帮助你们中的一些人。

if(userAgent.match(/^(?!.*chrome).(?!.*mobile).(?!.*firefox).(?!.*iPad).(?!.*iPhone).*safari.*$/i)){
  $('input[type="date"]').each(function(){
    $(this).BitmallDatePicker();
  })
}

Answer 11

我一直在寻找这个答案，我记得我之前遇到过这个问题。

在JavaScript中检测iOS上的Safari的最可靠方法是

if (window.outerWidth === 0) {
    // Code for Safari on iOS
} 

or 

if (window.outerHeight === 0) {
    // Code for Safari on iOS
}

出于某种原因，iOS上的Safari为window.outerHeight属性和window.outerWidth属性返回0。

适用于所有iOS版本的所有iPad和iPhone。每个其他浏览器和设备此属性正常工作。

不确定他们是否打算改变这一点，但现在它运作良好。

Answer 12

此正则表达式适用于我，干净简洁

const isIOSSafari = !! window.navigator.userAgent.match（/ Version / [\ d。] +。* Safari /）;

确定用户是否从移动Safari导航

12 个答案: