Обнаруживать ipad/iphone webview через javascript

Есть ли способ отличаться через javascript, если веб-сайт работает внутри сафари ipad или внутри приложения WebView?

Ответ 1

Здесь используется комбинация window.navigator.userAgent и window.navigator.standalone. Он может различать все четыре состояния, относящиеся к веб-приложению iOS: сафари (браузер), автономный (полноэкранный), 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
};

Ответ 2

Пользовательские агенты

Работа в UIWebView

Mozilla/5.0 (iPad; CPU OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Mobile/98176

Работа в Safari на iPad

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

Работа в Safari в Mac OS X

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

Работа в Chrome на Mac OS X

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

Работа в FireFox на Mac OS X

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

Ответ 3

Я думаю, что вы можете просто использовать User-Agent.

UPDATE

Страница, просматриваемая с помощью 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;

Ответ 4

Да:

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

Ответ 5

Я пробовал все эти решения, но в моем случае ничего не получалось,
Я собирался обнаружить Telegram внутри Webview. Я заметил, что Safari меняет текст в стиле телефона на ссылку с префиксом "tel:", поэтому я использовал это для написания этого кода, вы можете проверить его: 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>

Ответ 6

Обратите внимание, что этот подход не работает для iOS 10 и более старых версий.

В течение весны 2018 года ни один из предложенных методов не работал для меня, поэтому я предложил новый подход (не основанный на userAgent):

const hasValidDocumentElementRatio =
  [ 320 / 454 // 5, SE
  , 375 / 553 // 6, 7, 8
  , 414 / 622 // 6, 7, 8 Plus
  , 375 / 812 // X
  , 414 / 896 // Xs, Xr
  ].some(ratio =>
    ratio === document.documentElement.clientWidth / 
      document.documentElement.clientHeight
  )

const hasSafariInUA = /Safari/.test(navigator.userAgent)

const isiOSSafari = hasSafariInUA && hasValidDocumentElementRatio  // <- this one is set to false for webviews

https://gist.github.com/BorisChumichev/7c0ea033daf33da73306a396ffa174d1

Вы также можете расширить код для устройств iPad, я думаю, что это должно сработать.

Хорошо работал для Telegram, Facebook, ВКонтакте.

Ответ 7

Решение Neoneye больше не работает (см. комментарии) и может быть упрощено. С другой стороны, тестирование только "Safari" в UA адресовано гораздо больше, чем карманные устройства ios.

Это тест, который я использую:

var is_ios = /(iPhone|iPod|iPad).*AppleWebKit.*Safari/i.test(navigator.userAgent);

Ответ 8

Предлагает использовать Modernizr и проверять для indexeddb как this. Вы можете перекрестно проверить это с помощью конфигурации агента пользователя (устройства, ОС, браузера и т.д.), Но рекомендуется более чистое обнаружение функций.

Ответ 9

Я знаю, что этот код проверяет, доступен ли он из значка, добавленного на главный экран:

if (window.navigator.standalone == true) {
//not in safari
}

но я не уверен, как это повлияет на UIWebView. Единственное другое решение, о котором я мог думать, - это получить агент пользователя или использовать - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType и заменить строку запроса на странице, к которой вы обращаетесь, с тем, что использует страница, чтобы определить, к какому из них обращаются из веб-представления.

Ответ 10

В прошлый раз мне это нужно (JUST для целей WebView), я использовал эту проверку:

function isIOS() {
     return !/safari/.test( window.navigator.userAgent.toLowerCase()) || navigator.platform === 'iOS' || navigator.platform === 'iPhone';
}

Ответ 11

Я нашел простое решение для обнаружения iPhone или iPad. Это работает для меня хорошо.

var is_iPad = navigator.userAgent.match(/iPad/i) != null;
var is_iPhone = navigator.userAgent.match(/iPhone/i) != null;
    if(is_iPad || is_iPhone == true){
        //perform your action
    }

Ответ 12

Я не думаю, что есть что-то конкретное, что вы можете использовать в Javascript на стороне клиента, но если у вас есть контроль над тем, что может сделать исходный UIWebView, вам может потребоваться играть со строкой пользовательского агента, которую он создает, и тестировать что вместо этого на вашем клиентском Javascript? Немного взлома, который я знаю, но эй... Этот вопрос может дать некоторые указания по настройке пользовательского агента:

Изменить агент пользователя в UIWebView (iPhone SDK)

Ответ 13

@Sod, Ну, у меня нет ответа, но я не уверен, почему вы хотите проверить, так как браузерный движок независимо от того, будет ли его сафари (браузер) или приложение одним и тем же его Webkit, Да Приложение может настраивать возможности браузера, такие как: приложение хочет запускать JS или Display Image и т.д.

Я считаю, что вы должны проверить, не зависит ли Flash от браузера или от браузера отображается изображение или нет, или, вероятно, вы можете проверить размер экрана,