Détecter Safari à l'aide de jQuery

Bien que les deux soient des navigateurs Webkit, l'URL de Safari code des guillemets dans l'URL, contrairement à Chrome.

Par conséquent, je dois faire la distinction entre ces deux dans JS.

Les documents de détection de navigateur de jQuery marquent "safari" comme obsolète.

Existe-t-il une meilleure méthode ou est-ce que je m'en tiens simplement à la valeur obsolète pour le moment?

En utilisant un mélange de feature detectionet de Useragentchaîne:

    var is_opera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
    var is_Edge = navigator.userAgent.indexOf("Edge") > -1;
    var is_chrome = !!window.chrome && !is_opera && !is_Edge;
    var is_explorer= typeof document !== 'undefined' && !!document.documentMode && !is_Edge;
    var is_firefox = typeof window.InstallTrigger !== 'undefined';
    var is_safari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);

Usage:
if (is_safari) alert('Safari');

Ou pour Safari uniquement, utilisez ceci:

if ( /^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {alert('Its Safari');}

Ce qui suit identifie Safari 3.0+ et le distingue de Chrome:

isSafari = !!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/)

Malheureusement, les exemples ci-dessus détecteront également le navigateur par défaut d'Android comme Safari, ce qui n'est pas le cas. j'ai utilisé navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1 && navigator.userAgent.indexOf('Android') == -1

Pour vérifier Safari, j'ai utilisé ceci:

$.browser.safari = ($.browser.webkit && !(/chrome/.test(navigator.userAgent.toLowerCase())));
if ($.browser.safari) {
    alert('this is safari');
}

Cela fonctionne correctement.

Apparemment, la seule solution fiable et acceptée serait de faire une détection de fonctionnalités comme celle-ci:

browser_treats_urls_like_safari_does = false;
var last_location_hash = location.hash;
location.hash = '"blah"';
if (location.hash == '#%22blah%22')
    browser_treats_urls_like_safari_does = true;
location.hash = last_location_hash;

Le seul moyen que j'ai trouvé est de vérifier si navigator.userAgent contient un mot iPhone ou iPad

if (navigator.userAgent.toLowerCase().match(/(ipad|iphone)/)) {
    //is safari
}

Si vous vérifiez l'utilisation du navigateur $.browser. Mais si vous vérifiez la prise en charge des fonctionnalités (recommandé), utilisez $.support.

Vous ne devez PAS utiliser $ .browser pour activer / désactiver les fonctionnalités de la page. La raison étant ce n'est pas fiable et généralement tout simplement déconseillée.

Si vous avez besoin d'une prise en charge des fonctionnalités, je recommande modernizr .

//Check if Safari
  function isSafari() {
      return /^((?!chrome).)*safari/i.test(navigator.userAgent);
  }
//Check if MAC
     if(navigator.userAgent.indexOf('Mac')>1){
        alert(isSafari());
     }

http://jsfiddle.net/s1o943gb/10/

Un moyen très utile de résoudre ce problème est de détecter la version du kit Web du navigateur et de vérifier si c'est au moins celle dont nous avons besoin, sinon de faire autre chose.

En utilisant jQuery, cela ressemble à ceci:

"use strict";

$(document).ready(function() {
    var appVersion                  = navigator.appVersion;
    var webkitVersion_positionStart = appVersion.indexOf("AppleWebKit/") + 12;
    var webkitVersion_positionEnd   = webkitVersion_positionStart + 3;
    var webkitVersion               = appVersion.slice(webkitVersion_positionStart, webkitVersion_positionEnd);
	
    console.log(webkitVersion);

    if (webkitVersion < 537) {
        console.log("webkit outdated.");
    } else {
        console.log("webkit ok.");
    };
});

Cela fournit une solution sûre et permanente pour traiter les problèmes avec les différentes implémentations de Webkit du navigateur.

Bon codage!

Cela déterminera si le navigateur est Safari ou non.

if(navigator.userAgent.indexOf('Safari') !=-1 && navigator.userAgent.indexOf('Chrome') == -1)
{
    alert(its safari);
}else {
    alert('its not safari');
}

    // Safari uses pre-calculated pixels, so use this feature to detect Safari
    var canva = document.createElement('canvas');
    var ctx = canva.getContext("2d");
    var img = ctx.getImageData(0, 0, 1, 1);
    var pix = img.data;     // byte array, rgba
    var isSafari = (pix[3] != 0);   // alpha in Safari is not zero

J'utilise pour détecter le moteur de navigateur Apple, cette simple condition JavaScript:

 navigator.vendor.startsWith('Apple')

FONCTION générique

 var getBrowseActive = function (browserName) {
   return navigator.userAgent.indexOf(browserName) > -1;
 };