Обнаружить браузер Safari

Как обнаружить браузер Safari с помощью JavaScript? Я попробовал код ниже, и он обнаруживает не только Safari, но и браузер Chrome.

function IsSafari() {

  var is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1;
  return is_safari;

}

Вы можете легко использовать индекс Chrome для фильтрации Chrome:

var ua = navigator.userAgent.toLowerCase(); 
if (ua.indexOf('safari') != -1) { 
  if (ua.indexOf('chrome') > -1) {
    alert("1") // Chrome
  } else {
    alert("2") // Safari
  }
}

Примечание: всегда пытайтесь определить конкретное поведение, которое вы пытаетесь исправить, вместо того, чтобы указывать егоisSafari?

В крайнем случае, найдите Safari с помощью этого регулярного выражения:

var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);

Он использует негативные осмотры и исключает Chrome, Edge и все браузеры Android, которые включают Safariимя в свой пользовательский агент.

Как уже отмечали другие люди, обнаружение функции предпочтительнее, чем проверка конкретного браузера. Одна из причин заключается в том, что строка пользовательского агента может быть изменена. Другая причина в том, что строка может измениться и сломать ваш код в более новых версиях.

Если вы все еще хотите сделать это и протестировать любую версию Safari, я бы предложил использовать эту

var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 &&
               navigator.userAgent &&
               navigator.userAgent.indexOf('CriOS') == -1 &&
               navigator.userAgent.indexOf('FxiOS') == -1;

Это будет работать с любой версией Safari на всех устройствах: Mac, iPhone, iPod, iPad.

редактировать

Чтобы проверить в вашем текущем браузере: https://jsfiddle.net/j5hgcbm2/

Редактировать 2

Обновлен в соответствии с документами Chrome для корректного определения Chrome на iOS

Стоит отметить, что все браузеры на iOS являются просто обертками для Safari и используют один и тот же движок. См. Комментарий bfred.it к его собственному ответу в этой теме.

Редактировать 3

Обновлен в соответствии с документацией Firefox для правильного определения Firefox на iOS

Просто используйте:

var isSafari = window.safari !== undefined;
if (isSafari) console.log("Safari, yeah!");

Этот код используется для обнаружения только браузера Safari

if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) 
{
   alert("Browser is Safari");          
}

Поскольку userAgent для Chrome и Safari практически одинаковы, взглянуть на поставщика браузера проще.

Сафари

navigator.vendor ==  "Apple Computer, Inc."

Хром

navigator.vendor ==  "Google Inc."

FireFox (почему он пуст?)

navigator.vendor ==  ""

IE (почему он не определен?)

navigator.vendor ==  undefined

Только сафари без хрома:

Попробовав другие коды, я не нашел ни одной, которая бы работала с новыми и старыми версиями Safari.

Наконец, я сделал этот код, который очень хорошо работает для меня:

var ua = navigator.userAgent.toLowerCase(); 
var isSafari = false;
try {
  isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);
}
catch(err) {}
isSafari = (isSafari || ((ua.indexOf('safari') != -1)&& (!(ua.indexOf('chrome')!= -1) && (ua.indexOf('version/')!= -1))));

//test
if (isSafari)
{
  //Code for Safari Browser (Desktop and Mobile)
  document.getElementById('idbody').innerHTML = "This is Safari!";
}
else
{
  document.getElementById('idbody').innerHTML = "Not is Safari!";
}

<body id="idbody">
</body>

Я заметил, что только одно слово отличает Safari - «Версия». Так что это регулярное выражение будет работать идеально:

/.*Version.*Safari.*/.test(navigator.userAgent)

Я не знаю, почему ОП захотел обнаружить Safari, но в редких случаях вам нужно теперь прослушивать браузер, вероятно, гораздо важнее обнаружить механизм рендеринга, чем имя браузера. Например, в iOS все браузеры используют движок Safari / Webkit, поэтому бессмысленно указывать в качестве имени браузера «chrome» или «firefox», если в качестве базового средства визуализации используется Safari / Webkit. Я не тестировал этот код со старыми браузерами, но он работает со всем относительно недавним на Android, iOS, OS X, Windows и Linux.

<script>
    let browserName = "";

    if(navigator.vendor.match(/google/i)) {
        browserName = 'chrome/blink';
    }
    else if(navigator.vendor.match(/apple/i)) {
        browserName = 'safari/webkit';
    }
    else if(navigator.userAgent.match(/firefox\//i)) {
        browserName = 'firefox/gecko';
    }
    else if(navigator.userAgent.match(/edge\//i)) {
        browserName = 'edge/edgehtml';
    }
    else if(navigator.userAgent.match(/trident\//i)) {
        browserName = 'ie/trident';
    }
    else
    {
        browserName = navigator.userAgent + "\n" + navigator.vendor;
    }
    alert(browserName);
</script>

Чтобы уточнить:

• Все браузеры под iOS будут отмечены как "safari / webkit"
• Все браузеры под Android, кроме Firefox, будут отображаться как «chrome / blink»
• Chrome, Opera, Blisk, Vivaldi и т. Д. Будут сообщаться как «chrome / blink» в Windows, OS X или Linux

Я использую это

function getBrowserName() {
    var name = "Unknown";
    if(navigator.userAgent.indexOf("MSIE")!=-1){
        name = "MSIE";
    }
    else if(navigator.userAgent.indexOf("Firefox")!=-1){
        name = "Firefox";
    }
    else if(navigator.userAgent.indexOf("Opera")!=-1){
        name = "Opera";
    }
    else if(navigator.userAgent.indexOf("Chrome") != -1){
        name = "Chrome";
    }
    else if(navigator.userAgent.indexOf("Safari")!=-1){
        name = "Safari";
    }
    return name;   
}

if( getBrowserName() == "Safari" ){
    alert("You are using Safari");
}else{
    alert("You are surfing on " + getBrowserName(name));
}

Самый простой ответ:

function isSafari() {
 if (navigator.vendor.match(/[Aa]+pple/g).length > 0 ) 
   return true; 
 return false;
}

Для записей самый безопасный способ, который я нашел, это реализовать часть Safari кода обнаружения браузера из этого ответа :

const isSafari = window['safari'] && safari.pushNotification &&
    safari.pushNotification.toString() === '[object SafariRemoteNotification]';

Конечно, лучшим способом решения проблем, связанных с браузером, всегда является обнаружение функций, если это вообще возможно. Однако использование кода, подобного приведенному выше, все же лучше, чем определение строки агента.

Я знаю, что этот вопрос старый, но я все равно решил опубликовать ответ, так как он может кому-то помочь. В некоторых крайних случаях вышеприведенные решения не дали результата, поэтому нам пришлось реализовать его таким образом, чтобы обрабатывать iOS, Desktop и другие платформы отдельно.

function isSafari() {
    var ua = window.navigator.userAgent;
    var iOS = !!ua.match(/iP(ad|od|hone)/i);
    var hasSafariInUa = !!ua.match(/Safari/i);
    var noOtherBrowsersInUa = !ua.match(/Chrome|CriOS|OPiOS|mercury|FxiOS|Firefox/i)
    var result = false;
    if(iOS) { //detecting Safari in IOS mobile browsers
        var webkit = !!ua.match(/WebKit/i);
        result = webkit && hasSafariInUa && noOtherBrowsersInUa
    } else if(window.safari !== undefined){ //detecting Safari in Desktop Browsers
        result = true;
    } else { // detecting Safari in other platforms
        result = hasSafariInUa && noOtherBrowsersInUa
    }
    return result;
}

Модифицированный регулярное выражение для ответа выше

var isSafari = /^((?!chrome|android|crios|fxios).)*safari/i.test(navigator.userAgent);

• Crios - Chrome
• fxios - Firefox

Эта уникальная «проблема» является 100% признаком того, что браузер Safari (верите или нет).

if (Object.getOwnPropertyDescriptor(Document.prototype, 'cookie').descriptor === false) {
   console.log('Hello Safari!');
}

Это означает, что дескриптор объекта cookie установлен в false в Safari, а для всех остальных - true, что фактически вызывает головную боль в другом проекте. Удачного кодирования!

Может быть, это работает:

Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor')

РЕДАКТИРОВАТЬ: НЕ Дольше работать

Я создаю функцию, которая возвращает логический тип:

export const isSafari = () => navigator.userAgent.toLowerCase().indexOf('safari') !== -1

Нюхание агента пользователя действительно сложно и ненадежно. Мы пытались обнаружить Safari на iOS с помощью чего-то вроде ответа @ qingu выше, он работал довольно хорошо для Safari, Chrome и Firefox. Но он ошибочно определил Opera и Edge как Safari.

Итак, мы пошли с обнаружением функций, как это выглядит на сегодняшний день, serviceWorkerподдерживается только в Safari, а не в любом другом браузере на iOS. Как указано в https://jakearchibald.github.io/isserviceworkerready/

Поддержка не включает версии iOS сторонних браузеров на этой платформе (см. Поддержку Safari).

Итак, мы сделали что-то вроде

if ('serviceWorker' in navigator) {
    return 'Safari';
}
else {
    return 'Other Browser';
}

Примечание : не тестировалось в Safari на MacOS.