Javascript 确定用户是否从mobile Safari导航

我有一个应用程序，我想根据用户导航的位置将他们重定向到不同的页面

如果从web剪辑导航，请不要重定向。 如果从mobile Safari导航，请重定向到Safari.aspx。 如果从其他任何位置导航，请重定向到unavailable.aspx

我可以使用来确定用户是否是通过网络剪辑导航的，但我很难确定用户是通过iPhone或iPod上的mobile 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";
}

---

更新：这是一个非常旧的答案，我无法删除它，因为答案已被接受。检查是否有更好的解决方案

---

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

最佳做法是：

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

---

事实上，没有一种灵丹妙药可以检测移动狩猎。有相当多的浏览器可能会使用mobile safari用户代理的关键字。也许您可以尝试功能检测并不断更新规则。

请参阅-iOS上Safari和iOS上Chrome的用户代理字符串非常相似：

铬

Mozilla/5.0（iPhone；U；CPU iPhone OS 5_1_1像Mac OS X；en）AppleWebKit/534.46.0（KHTML像Gecko）CriOS/19.0.1084.60 Mobile/9B206 Safari/7534.48.3

狩猎

Mozilla/5.0（iPhone；U；CPU类似Mac OS X；en）AppleWebKit/420+（KHTML，类似Gecko）版本/3.0 Mobile/1A543 Safari/419.3

看起来这里最好的方法是首先按照其他答案的建议检查iOS，然后过滤使Safari UA独一无二的东西，我建议最好通过“is AppleWebKit and is not CriOS”来完成：

---

下降的代码只能找到mobile safari，其他什么也找不到（除了dolphin和其他小型浏览器）

---

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

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


// Usage:
// if iOSSafari(window.navigator.userAgent) { /* iOS Safari code here */ }

// Testing:
var iPhoneSafari = [
  "Mozilla/5.0 (iPhone; CPU iPhone OS 14_4_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Mobile/15E148 Safari/604.1",
  "Mozilla/5.0 (Apple-iPhone7C2/1202.466; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543 Safari/419.3",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A5370a Safari/604.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0 Mobile/15E148 Safari/604.1",
  "Mozilla/5.0 (iPhone9,3; U; CPU iPhone OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14A403 Safari/602.1",
  "Mozilla/5.0 (iPhone9,4; U; CPU iPhone OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14A403 Safari/602.1",
];
console.log("All true:", iPhoneSafari.map(iOSSafari));

var iPhoneNotSafari = [
  "Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/69.0.3497.105 Mobile/15E148 Safari/605.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) FxiOS/13.2b11866 Mobile/16A366 Safari/605.1.15",
];
console.log("All false:", iPhoneNotSafari.map(iOSSafari));

---

查看所有答案，以下是有关建议正则表达式的一些提示：

• AppleWebKit

  也与桌面Safari相匹配（不仅仅是移动版）
• 对于这样简单的正则表达式，无需多次调用

  .match

  ，而更喜欢较轻的

  .test

  方法

• g

  （全局）regex标志无效，而

  i

  （不区分大小写）可能有用
• 不需要捕获（括号），我们只是测试字符串

我只是在使用它，因为对于移动Chrome来说，获得

true

对我来说是可以的（相同的行为）：

---

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

我对@unwitting的答案投了赞成票，因为它不可避免地让我走了。但是，在iOS Webview中渲染SPA时，我需要对其进行一些调整

function is_iOS () {
    /*
        Returns (true/false) 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 webkitUa !== 'undefined' && iOS && webkitUa && !ua.match(/CriOS/i);
};

---

主要区别在于，将

webkit

重命名为

webkitUa

，以防止与SPA和UIView之间用作消息处理程序的根

webkit

对象发生冲突。

我知道这是一个旧线程，但我想与大家分享我的解决方案

我需要检测用户何时从桌面Safari导航（因为我们在2017年年中，苹果还没有对

输入[type=“date”]

提供任何支持

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

希望它能帮助你们中的一些人

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

---

我在寻找这个答案，我记得我以前遇到过这个问题

在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。此属性的其他浏览器和设备均正常工作

---

不确定他们是否打算更改此项，但目前它运行良好。

此正则表达式适用于我，简洁明了

---

---

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

这同样适用于Chrome iOS：（这也会检测到移动浏览器。那么我们应该如何区分iOS Safari和iOS chrome？有什么想法吗？这两个正则表达式可以很容易地组合起来。这也与桌面Safari相匹配。我认为不是。与Safari iOS浏览器有什么不同？我认为这个表达式不仅会排除Safari，还会排除所有iphone/ipad浏览器。这不是问题所在。）回答正确，因为如果我从chrome for ios访问它，它将返回true。这不起作用，因为用户现在可以在ios上使用移动chrome进行浏览，即使它不是移动Safari，它仍将返回true。这不会检测用户是否使用移动chrome。chrome ios有一个非常古老的javascript引擎e（由于苹果的政策）与Safari相比，使得一些渲染变得不可能。这不应该被标记为正确答案，因为它包括在iPhone上运行的任何浏览器。这个问题专门用来检测移动Safari。@fabricioflores c'est la vie:（+1是这里涵盖所有规格的唯一答案。我只需将iOS测试正则表达式更改为

/iP（ad | hone）/I

，这样您就不需要or了。@sareed我总是发现能够正则表达式iP（ad | od | hone）令人惊讶地满足iOS上愚蠢的Opera在上面的代码中仍然会通过true，所以我将最后一行更改为：var iOSSafari=iOS&&webkit&&ua.match（/CriOS/I）&&ua.match（/OPiOS/I）；回答得很好。但是，当可以使用test（）时，为什么要对match使用双负（！！）？例如，在我的例子中没有。我想显示为iOS+Chrome制作的自定义智能横幅，但不想在iOS+Safari上显示此横幅，因为iOS+Safari已经有一个内置的智能横幅。@JobaDiniz我知道许多人只想在mobile Safari上做一些事情，而不想在其他浏览器上做。但是，事实上，与令牌匹配的浏览器比如“iPad”、“iOS”、“iPhone”等等，并不意味着

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


// Usage:
// if iOSSafari(window.navigator.userAgent) { /* iOS Safari code here */ }

// Testing:
var iPhoneSafari = [
  "Mozilla/5.0 (iPhone; CPU iPhone OS 14_4_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Mobile/15E148 Safari/604.1",
  "Mozilla/5.0 (Apple-iPhone7C2/1202.466; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543 Safari/419.3",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A5370a Safari/604.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0 Mobile/15E148 Safari/604.1",
  "Mozilla/5.0 (iPhone9,3; U; CPU iPhone OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14A403 Safari/602.1",
  "Mozilla/5.0 (iPhone9,4; U; CPU iPhone OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14A403 Safari/602.1",
];
console.log("All true:", iPhoneSafari.map(iOSSafari));

var iPhoneNotSafari = [
  "Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/69.0.3497.105 Mobile/15E148 Safari/605.1",
  "Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) FxiOS/13.2b11866 Mobile/16A366 Safari/605.1.15",
];
console.log("All false:", iPhoneNotSafari.map(iOSSafari));

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

function is_iOS () {
    /*
        Returns (true/false) 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 webkitUa !== 'undefined' && iOS && webkitUa && !ua.match(/CriOS/i);
};

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

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

or 

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

var isApple = false;    
if(/iPhone|iPad|iPod/i.test(navigator.userAgent)) {      
  isApple = true;
}