detectar navegador javascript

Detectar el navegador Safari

Question

¿Cómo detectar el navegador Safari usando JavaScript? He intentado el código a continuación y no solo detecta Safari, sino también el navegador Chrome.

function IsSafari() {

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

}

Answer 1

Como ya han señalado otras personas, se prefiere la detección de características antes que buscar un navegador específico. Una razón es que la cadena del agente de usuario puede ser alterada. Otra razón es que la cadena puede cambiar y romper su código en versiones más nuevas.

Si aún quieres hacerlo y probar cualquier versión de Safari, te sugiero usar esto

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

Esto funcionará con cualquier versión de Safari en todos los dispositivos: Mac, iPhone, iPod, iPad.

Editar

Para probar en su navegador actual: https://jsfiddle.net/urc9azg5/3/

Editar 2

Actualizado de acuerdo con los documentos de Chrome para detectar Chrome en iOS correctamente

Vale la pena señalar que todos los navegadores en iOS son solo envoltorios para Safari y usan el mismo motor. Vea el comentario de bfred.it sobre su propia respuesta en este hilo.

Answer 2

Debido a que userAgent para Chrome y Safari son casi iguales, puede ser más fácil mirar al proveedor del navegador

Safari

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

Cromo

navigator.vendor ==  "Google Inc."

FireFox (¿por qué está vacío?)

navigator.vendor ==  ""

IE (¿por qué no está definido?)

navigator.vendor ==  undefined

Answer 3

Este código se usa para detectar solo el navegador safari

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

Answer 4

Observé que solo una palabra distingue a Safari - "Versión". Entonces esta expresión regular funcionará perfecto:

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

Answer 5

Puedes usar fácilmente el índice de Chrome para filtrar Chrome:

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

Answer 6

Quizás esto funcione:

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

EDITAR: NO TRABAJAR MÁS

Answer 7

Regex modificado para la respuesta above

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

• crios - Chrome
• fxios - Firefox

Answer 8

Sé que esta pregunta es antigua, pero pensé en publicar la respuesta de todos modos, ya que puede ayudar a alguien. Las soluciones anteriores fallaron en algunos casos extremos, por lo que tuvimos que implementarlo de una manera que maneja iOS, Desktop y otras plataformas por separado.

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

Answer 9

Solo Safari sin Chrome:

Después de probar otros códigos, no encontré ninguno que funcione con versiones nuevas y antiguas de Safari.

Finalmente, hice este código que funciona muy bien para mí:

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>

Answer 10

Solo usa:

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

Answer 11

yo uso esto

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

Answer 12

Este "problema" único es 100% de que el navegador es Safari (lo creas o no).

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

Esto significa que el descriptor de objeto de cookie está configurado como falso en Safari mientras que en el otro todo es verdadero, lo que en realidad me da dolor de cabeza en el otro proyecto. Feliz codificación!

Answer 13

Nota: siempre trate de detectar el comportamiento específico que está tratando de corregir, en lugar de isSafari? con isSafari?

Como último recurso, detecta Safari con esta expresión regular:

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

Utiliza visualizaciones negativas y excluye Chrome, Edge y todos los navegadores Android que incluyen el nombre de Safari en su agente de usuario.