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

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

103 голосов
/ 30 октября 2011

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

function IsSafari() {

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

}

Ответы [ 14 ]

112 голосов
/ 07 мая 2014

Примечание: всегда пытайтесь определить конкретное поведение, которое вы пытаетесь исправить, вместо нацеливания на него с помощью isSafari?

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

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

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

91 голосов
/ 30 октября 2011

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

var ua = navigator.userAgent.toLowerCase(); 
if (ua.indexOf('safari') != -1) { 
  if (ua.indexOf('chrome') > -1) {
    alert("1") // Chrome
  } else {
    alert("2") // Safari
  }
}
66 голосов
/ 30 июля 2015

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

Если вы все еще хотите это сделать и протестировать для любой версии 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

32 голосов
/ 12 февраля 2017

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

var isSafari = window.safari !== undefined;
if (isSafari) console.log("Safari, yeah!");
18 голосов
/ 22 апреля 2014

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

if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) 
{
   alert("Browser is Safari");          
}
9 голосов
/ 02 декабря 2016

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

Safari

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

Chrome

navigator.vendor ==  "Google Inc."

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

navigator.vendor ==  ""

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

navigator.vendor ==  undefined
5 голосов
/ 02 марта 2017

Только Safari без хрома:

Попробовав другие коды, я не нашел ни одного, который бы работал с новыми и старыми версиями 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>
3 голосов
/ 21 сентября 2018

Я не знаю, почему ОП захотел обнаружить 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 и т. Д. Будутвсе сообщается как «хром / мерцание» в Windows, OS X или Linux
3 голосов
/ 20 июня 2016

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

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));
}
2 голосов
/ 08 мая 2018

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

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