Вопрос

У меня есть приложение, и я хотел бы перенаправить пользователей на разные страницы на основе того, где они навигациируются.

При навигации от веб-клипа не перенаправляйте. При навигации от Mobile Safari перенаправляйте в Safari.aspx. При навигации от где-нибудь еще перенаправляйтесь на unvailable.aspx

Я смог использовать iPhone WebApps, есть ли способ обнаружить, как он был загружен? Главная Экран против Safari? Чтобы определить, был ли пользователь навигации по веб-клипу, но у меня проблемы с определением, если пользователь навигации от мобильных Safari на iPhone или iPod.

Вот что у меня есть:

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» в пользовательский агент нить:

var userAgent = window.navigator.userAgent;

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

Другие советы

Видеть https://developer.chrome.com/multidevice/user-agent#chrome_for_ios_user_Agent. - Строки агента пользователя для Safari на iOS и для хрома на iOS неудобно похоже:

Хром

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

Сафари

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 уникальным, что я бы предложил, лучше всего выполнить с «является AppleWebkit и не Crios»:

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);

Лучшая практика:

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

Падающий код только найду мобильные сафари и ничего больше (кроме дельфина и других небольших браузеров)

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

Объединил все ответы и комментарии. И это результат.

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));

Увидев все ответы, вот несколько советов о предложенных Regexes:

  • AppleWebKit Матч настольный Safari тоже (не только мобильный)
  • Нет необходимости звонить .match более одного раза для таких простых регенов, и предпочитаю легче .test метод.
  • то g (глобальный) флаг Regex бесполезный, в то время как i (случаем нечувствителен) может быть полезен
  • Нет необходимости для захвата (скобки), мы просто тестируем строку

Я просто использую это с момента получения true Для мобильного хрома в порядке для меня (то же поведение):

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

(Я просто хочу обнаружить, если устройство является целью для приложения iOS)

На самом деле, нет серебряной пули обнаружения мобильных сафари. Есть довольно несколько браузеров, могут использовать ключевые слова пользовательского агента мобильных сафари. Может быть, вы можете попробовать обнаружение функции и продолжать обновлять правило.

Я усваивал ответ @unwitting, так как он неизбежно поймал меня. Однако при рендере моего спа в IOS WebView мне нужно немного настроить его.

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, чтобы предотвратить столкновение с корнем webkit Объект, используемый в качестве обработчика сообщений между SPA & UIView.

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

Я знаю, что это старая тема, но я хотел бы поделиться своим решением с вами, ребята.

Мне нужно было обнаружить, когда пользователь навигаций от настольных Safari (потому что мы находимся в середине 2017 года, а Apple не дает никакой поддержки для input[type="date"] ВСЕ ЖЕ...

Итак, я сделал отступление на сегодняшний день DatePicker для него). Но относится только к 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();
  })
}

Я искал этот ответ, и я вспомнил, что я наткнулся на это раньше.

Наиболее надежный способ обнаружить Safari на iOS в JavaScript

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

or 

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

По какой-то причине Safari на iOS возвращается 0 для Window.Outerheight имущества и свойства Window.Outerwidth.

Это для всех iPad и iPhone на всех версиях iOS. Каждый другой браузер и устройство это свойство работает нормально.

Не уверены, намерены ли они менять это, но сейчас он хорошо работает.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top