Come rilevare i browser Safari, Chrome, IE, Firefox e Opera?

Ho 5 componenti aggiuntivi / estensioni per FF, Chrome, IE, Opera e Safari.

Come posso riconoscere il browser dell'utente e reindirizzare (dopo aver fatto clic su un pulsante di installazione) per scaricare il componente aggiuntivo corrispondente?

Cercare su Google per il rilevamento affidabile del browser spesso comporta il controllo della stringa dell'agente utente. Questo metodo non è affidabile, perché è banale falsificare questo valore.
Ho scritto un metodo per rilevare i browser digitando l'anatra .

Utilizzare il metodo di rilevamento del browser solo se è veramente necessario, come mostrare le istruzioni specifiche del browser per installare un'estensione. Utilizzare il rilevamento delle funzionalità quando possibile.

Demo: https://jsfiddle.net/6spj1059/

// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

// Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined';

// Safari 3.0+ "[object HTMLElementConstructor]" 
var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification));

// Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode;

// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;

// Chrome 1 - 79
var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);

// Edge (based on chromium) detection
var isEdgeChromium = isChrome && (navigator.userAgent.indexOf("Edg") != -1);

// Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS;


var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isEdge: ' + isEdge + '<br>';
output += 'isEdgeChromium: ' + isEdgeChromium + '<br>';
output += 'isBlink: ' + isBlink + '<br>';
document.body.innerHTML = output;

Analisi di affidabilità

Il metodo precedente dipendeva dalle proprietà del motore di rendering ( -moz-box-sizinge -webkit-transform) per rilevare il browser. Questi prefissi verranno infine eliminati, quindi per rendere il rilevamento ancora più affidabile, sono passato a caratteristiche specifiche del browser:

• Internet Explorer: compilazione condizionale di JScript (fino a IE9) e document.documentMode.
• Edge: nei browser Trident e Edge, l'implementazione di Microsoft espone il StyleMediacostruttore. Escludendo Trident ci lascia con Edge.
• Edge (basato sul cromo): l'agente utente include il valore "Edg / [versione]" alla fine (es: "Mozilla / 5.0 (Windows NT 10.0; Win64; x64) AppleWebKit / 537.36 (KHTML, come Gecko) Chrome / 80.0.3987.16 Safari / 537.36 Edg / 80.0.361.9 ").
• Firefox: API di Firefox per l'installazione di componenti aggiuntivi: InstallTrigger
• Chrome: l' chromeoggetto globale , contenente diverse proprietà tra cui un chrome.webstoreoggetto documentato .
• L'aggiornamento 3 chrome.webstoreè obsoleto e non definito nelle versioni recenti
• Safari: un modello di denominazione unico nella denominazione dei costruttori. Questo è il metodo meno duraturo di tutte le proprietà elencate e indovina un po '? In Safari 9.1.3 è stato risolto. Quindi stiamo verificando contro SafariRemoteNotification, che è stato introdotto dopo la versione 7.1, per coprire tutti i Safari dalla versione 3.0 in poi.
• Opera: window.operaesiste da anni, ma verrà abbandonato quando Opera sostituirà il suo motore con Blink + V8 (utilizzato da Chromium).
• Aggiornamento 1: Opera 15 è stata rilasciata , la sua stringa UA sembra Chrome, ma con l'aggiunta di "OPR". In questa versione l' chromeoggetto è definito (ma chrome.webstorenon lo è). Dal momento che Opera si sforza di clonare Chrome, uso lo user agent sniffing per questo scopo.
• Aggiornamento 2: !!window.opr && opr.addonspuò essere utilizzato per rilevare Opera 20+ (sempreverde).
• Blink: è CSS.supports() stato introdotto in Blink dopo che Google ha acceso Chrome 28. È ovviamente lo stesso Blink utilizzato in Opera.

Testato con successo in:

• Firefox 0,8 - 61
• Chrome 1.0 - 71
• Opera 8.0 - 34
• Safari 3.0 - 10
• IE 6 - 11
• Bordo - 20-42
• Edge Dev - 80.0.361.9

Aggiornato a novembre 2016 per includere il rilevamento dei browser Safari dalla 9.1.3 in poi

Aggiornato ad agosto 2018 per aggiornare gli ultimi test riusciti su Chrome, Firefox IE e Edge.

Aggiornato a gennaio 2019 per correggere il rilevamento di Chrome (a causa della deprecazione di window.chrome.webstore) e includere gli ultimi test riusciti su Chrome.

Aggiornato a dicembre 2019 per aggiungere Edge in base al rilevamento di Chromium (basato sul commento @Nimesh).

Puoi provare a seguire il modo per verificare la versione del browser.

    <!DOCTYPE html>
    <html>
    <body>
    <p>What is the name(s) of your browser?</p>
    <button onclick="myFunction()">Try it</button>
    <p id="demo"></p>
    <script>

    function myFunction() { 
     if((navigator.userAgent.indexOf("Opera") || navigator.userAgent.indexOf('OPR')) != -1 ) 
    {
        alert('Opera');
    }
    else if(navigator.userAgent.indexOf("Chrome") != -1 )
    {
        alert('Chrome');
    }
    else if(navigator.userAgent.indexOf("Safari") != -1)
    {
        alert('Safari');
    }
    else if(navigator.userAgent.indexOf("Firefox") != -1 ) 
    {
         alert('Firefox');
    }
    else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
    {
      alert('IE'); 
    }  
    else 
    {
       alert('unknown');
    }
    }
    </script>

    </body>
    </html>

E se hai bisogno di conoscere solo la versione di IE Browser, puoi seguire il codice seguente. Questo codice funziona bene per la versione da IE6 a IE11

<!DOCTYPE html>
<html>
<body>

<p>Click on Try button to check IE Browser version.</p>

<button onclick="getInternetExplorerVersion()">Try it</button>

<p id="demo"></p>

<script>
function getInternetExplorerVersion() {
   var ua = window.navigator.userAgent;
        var msie = ua.indexOf("MSIE ");
        var rv = -1;

        if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer, return version number
        {               

            if (isNaN(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))))) {
                //For IE 11 >
                if (navigator.appName == 'Netscape') {
                    var ua = navigator.userAgent;
                    var re = new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})");
                    if (re.exec(ua) != null) {
                        rv = parseFloat(RegExp.$1);
                        alert(rv);
                    }
                }
                else {
                    alert('otherbrowser');
                }
            }
            else {
                //For < IE11
                alert(parseInt(ua.substring(msie + 5, ua.indexOf(".", msie))));
            }
            return false;
        }}
</script>

</body>
</html>

So che potrebbe essere eccessivo usare una lib per questo, ma solo per arricchire il thread, puoi controllare il modo di is.js per farlo:

is.firefox();
is.ie(6);
is.not.safari();

Ecco alcune importanti librerie che gestiscono il rilevamento del browser a partire da dicembre 2019.

Bowser di lancedikson - 4.065 ★ s - Ultimo aggiornamento 2 ottobre 2019 - 4,8 KB

var result = bowser.getParser(window.navigator.userAgent);
console.log(result);
document.write("You are using " + result.parsedResult.browser.name +
               " v" + result.parsedResult.browser.version + 
               " on " + result.parsedResult.os.name);

<script src="https://unpkg.com/bowser@2.7.0/es5.js"></script>

* supporta Edge basato su Chromium

Platform.js di bestiejs - 2.550 ★ s - Ultimo aggiornamento 14 aprile 2019-5,9 KB

console.log(platform);
document.write("You are using " + platform.name +
               " v" + platform.version + 
               " on " + platform.os);

<script src="https://cdnjs.cloudflare.com/ajax/libs/platform/1.3.5/platform.min.js"></script>

jQuery Browser di gabceb - 504 ★ s - Ultimo aggiornamento 23 nov 2015 - 1.3KB

console.log($.browser)
document.write("You are using " + $.browser.name +
               " v" + $.browser.versionNumber + 
               " on " + $.browser.platform);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.1.0/jquery.browser.min.js"></script>

Detect.js (Archiviato) di darcyclarke - 522 ★ s - Ultimo aggiornamento 26 Ott 2015 - 2.9KB

var result = detect.parse(navigator.userAgent);
console.log(result);
document.write("You are using " + result.browser.family +
               " v" + result.browser.version + 
               " on " + result.os.family);

<script src="https://cdnjs.cloudflare.com/ajax/libs/Detect.js/2.2.2/detect.min.js"></script>

Browser Detect (Archiviato) di QuirksMode - Ultimo aggiornamento 14 Nov 2013 - 884B

console.log(BrowserDetect)
document.write("You are using " + BrowserDetect.browser +
               " v" + BrowserDetect.version + 
               " on " + BrowserDetect.OS);

<script src="https://kylemit.github.io/libraries/libraries/BrowserDetect.js"></script>

Menzioni importanti:

• WhichBrowser - 1.355 ★ s - Ultimo aggiornamento 2 ottobre 2018
• Modernizr - 23.397 ★ s - Ultimo aggiornamento 12 gennaio 2019 - Per nutrire un cavallo nutrito, il rilevamento delle caratteristiche dovrebbe guidare qualsiasi domanda di stile canIuse . Il rilevamento del browser è davvero solo per fornire immagini personalizzate, scaricare file o istruzioni per i singoli browser.

Ulteriori letture

• Stack Overflow - Rilevamento del browser in JavaScript?
• Stack Overflow : come è possibile rilevare la versione di un browser?

Nel caso qualcuno lo trovi utile, ho trasformato la risposta di Rob W in una funzione che restituisce la stringa del browser piuttosto che avere più variabili fluttuanti. Dal momento che il browser non può davvero cambiare senza caricare di nuovo tutto, ho creato il risultato nella cache per impedirgli di doverlo elaborare alla successiva chiamata della funzione.

/**
 * Gets the browser name or returns an empty string if unknown. 
 * This function also caches the result to provide for any 
 * future calls this function has.
 *
 * @returns {string}
 */
var browser = function() {
    // Return cached result if avalible, else get result then cache it.
    if (browser.prototype._cachedResult)
        return browser.prototype._cachedResult;

    // Opera 8.0+
    var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

    // Firefox 1.0+
    var isFirefox = typeof InstallTrigger !== 'undefined';

    // Safari 3.0+ "[object HTMLElementConstructor]" 
    var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);

    // Internet Explorer 6-11
    var isIE = /*@cc_on!@*/false || !!document.documentMode;

    // Edge 20+
    var isEdge = !isIE && !!window.StyleMedia;

    // Chrome 1+
    var isChrome = !!window.chrome && !!window.chrome.webstore;

    // Blink engine detection
    var isBlink = (isChrome || isOpera) && !!window.CSS;

    return browser.prototype._cachedResult =
        isOpera ? 'Opera' :
        isFirefox ? 'Firefox' :
        isSafari ? 'Safari' :
        isChrome ? 'Chrome' :
        isIE ? 'IE' :
        isEdge ? 'Edge' :
        isBlink ? 'Blink' :
        "Don't know";
};

console.log(browser());

Variante corta

var browser = (function() {
    var test = function(regexp) {
        return regexp.test(window.navigator.userAgent);
    }
    switch (true) {
        case test(/edg/i): return "edge";
        case test(/opr/i) && (!!window.opr || !!window.opera): return "opera";
        case test(/chrome/i) && !!window.chrome: return "chrome";
        case test(/trident/i): return "ie";
        case test(/firefox/i): return "firefox";
        case test(/safari/i): return "safari";
        default: return "other";
    }
})();
console.log(browser)

Ecco una versione modificata del 2016 della risposta di Rob, tra cui Microsoft Edge e il rilevamento di Blink:

( modifica : ho aggiornato la risposta di Rob sopra con queste informazioni.)

// Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
// Firefox 1.0+
isFirefox = typeof InstallTrigger !== 'undefined';
// Safari 3.0+
isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification);
// Internet Explorer 6-11
isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
isChrome = !!window.chrome && !!window.chrome.webstore;
// Blink engine detection
isBlink = (isChrome || isOpera) && !!window.CSS;

/* Results: */
console.log("isOpera", isOpera);
console.log("isFirefox", isFirefox);
console.log("isSafari", isSafari);
console.log("isIE", isIE);
console.log("isEdge", isEdge);
console.log("isChrome", isChrome);
console.log("isBlink", isBlink);

La bellezza di questo approccio è che si basa sulle proprietà del motore del browser, quindi copre anche i browser derivati, come Yandex o Vivaldi, che sono praticamente compatibili con i principali browser di cui utilizzano i motori. L'eccezione è Opera, che si basa sullo sniffing dell'agente utente, ma oggi (vale a dire dalla versione 15 in poi) anche Opera è essa stessa solo una shell per Blink.

È possibile utilizzare trye catchutilizzare i diversi messaggi di errore del browser. IE e edge sono stati confusi, ma ho usato la tipizzazione duck da Rob W (basata su questo progetto qui: https://www.khanacademy.org/computer-programming/i-have-opera/2395080328 ).

var getBrowser = function() {        
    try {
        var e;
        var f = e.width;
    } catch(e) {
        var err = e.toString();

        if(err.indexOf("not an object") !== -1) {
            return "safari";
        } else if(err.indexOf("Cannot read") !== -1) {
            return "chrome";
        } else if(err.indexOf("e is undefined") !== -1) {
            return "firefox";
        } else if(err.indexOf("Unable to get property 'width' of undefined or null reference") !== -1) {
            if(!(false || !!document.documentMode) && !!window.StyleMedia) {
                return "edge";
            } else {
                return "IE";
            }
        } else if(err.indexOf("cannot convert e into object") !== -1) {
            return "opera";
        } else {
            return undefined;
        }
    }
};

Grazie a tutti. Ho testato i frammenti di codice qui sui browser recenti: Chrome 55, Firefox 50, IE 11 e Edge 38 e ho trovato la seguente combinazione che ha funzionato per me per tutti loro. Sono sicuro che può essere migliorato, ma è una soluzione rapida per chiunque abbia bisogno:

var browser_name = '';
isIE = /*@cc_on!@*/false || !!document.documentMode;
isEdge = !isIE && !!window.StyleMedia;
if(navigator.userAgent.indexOf("Chrome") != -1 && !isEdge)
{
    browser_name = 'chrome';
}
else if(navigator.userAgent.indexOf("Safari") != -1 && !isEdge)
{
    browser_name = 'safari';
}
else if(navigator.userAgent.indexOf("Firefox") != -1 ) 
{
    browser_name = 'firefox';
}
else if((navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true )) //IF IE > 10
{
    browser_name = 'ie';
}
else if(isEdge)
{
    browser_name = 'edge';
}
else 
{
   browser_name = 'other-browser';
}
$('html').addClass(browser_name);

Aggiunge una classe CSS all'HTML, con il nome del browser.

Non ho idea se sia utile a nessuno, ma ecco una variante per rendere felice TypeScript.

export function getBrowser() {

// Opera 8.0+
if ((!!window["opr"] && !!["opr"]["addons"]) || !!window["opera"] || navigator.userAgent.indexOf(' OPR/') >= 0) {
    return 'opera';
}

// Firefox 1.0+
if (typeof window["InstallTrigger"] !== 'undefined') {
    return 'firefox';
}

// Safari 3.0+ "[object HTMLElementConstructor]" 
if (/constructor/i.test(window["HTMLElement"]) || (function(p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof window["safari"] !== 'undefined' && window["safari"].pushNotification))) {
    return 'safari';
}

// Internet Explorer 6-11
if (/*@cc_on!@*/false || !!document["documentMode"]) {
    return 'ie';
}

// Edge 20+
if (!(/*@cc_on!@*/false || !!document["documentMode"]) && !!window["StyleMedia"]) {
    return 'edge';
}

// Chrome 1+
if (!!window["chrome"] && !!window["chrome"].webstore) {
    return 'chrome';
}

// Blink engine detection
if (((!!window["chrome"] && !!window["chrome"].webstore) || ((!!window["opr"] && !!["opr"]["addons"]) || !!window["opera"] || navigator.userAgent.indexOf(' OPR/') >= 0)) && !!window["CSS"]) {
    return 'blink';
}

}

Rilevamento di browser su desktop e dispositivi mobili: Edge, Opera, Chrome, Safari, Firefox, IE

Ho apportato alcune modifiche al codice @nimesh ora funziona anche con Edge e il problema di Opera è stato risolto:

function getBrowserName() {

    if ( navigator.userAgent.indexOf("Edge") > -1 && navigator.appVersion.indexOf('Edge') > -1 ) {
        return 'Edge';
    }
    else if( navigator.userAgent.indexOf("Opera") != -1 || navigator.userAgent.indexOf('OPR') != -1 )
    {
        return 'Opera';
    }
    else if( navigator.userAgent.indexOf("Chrome") != -1 )
    {
        return 'Chrome';
    }
    else if( navigator.userAgent.indexOf("Safari") != -1)
    {
        return 'Safari';
    }
    else if( navigator.userAgent.indexOf("Firefox") != -1 ) 
    {
        return 'Firefox';
    }
    else if( ( navigator.userAgent.indexOf("MSIE") != -1 ) || (!!document.documentMode == true ) ) //IF IE > 10
    {
        return 'IE';
    }  
    else 
    {
        return 'unknown';
    }
}

Grazie utente @nimesh: 2063564

C'è anche un metodo meno "confuso" che funziona con tutti i browser più diffusi. Google ha incluso un controllo del browser nella sua Libreria di chiusura . In particolare, dai un'occhiata a goog.userAgente goog.userAgent.product. In questo modo, sei anche aggiornato se qualcosa cambia nel modo in cui i browser si presentano (dato che esegui sempre l'ultima versione del compilatore di chiusura).

Se devi sapere qual è la versione numerica di un determinato browser, puoi utilizzare il frammento seguente. Attualmente ti dirà la versione di Chrome / Chromium / Firefox:

var match = $window.navigator.userAgent.match(/(?:Chrom(?:e|ium)|Firefox)\/([0-9]+)\./);
var ver = match ? parseInt(match[1], 10) : 0;

UAParser è una delle librerie JavaScript leggere per identificare browser, motore, sistema operativo, CPU e tipo / modello di dispositivo dalla stringa userAgent.

C'è un CDN disponibile. Qui, ho incluso un codice di esempio per rilevare il browser utilizzando UAParser.

<!doctype html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/ua-parser-js@0/dist/ua-parser.min.js"></script>
<script type="text/javascript">
    var parser = new UAParser();
    var result = parser.getResult();
    console.log(result.browser);     // {name: "Chromium", version: "15.0.874.106"}
</script>
</head>
<body>
</body>
</html>

Ora puoi usare il valore di result.browserper programmare in modo condizionale la tua pagina.

Tutorial di origine: come rilevare browser, motore, sistema operativo, CPU e dispositivo utilizzando JavaScript?

var BrowserDetect = {
        init: function () {
            this.browser = this.searchString(this.dataBrowser) || "Other";
            this.version = this.searchVersion(navigator.userAgent) || this.searchVersion(navigator.appVersion) || "Unknown";
        },
        searchString: function (data) {
            for (var i = 0; i < data.length; i++) {
                var dataString = data[i].string;
                this.versionSearchString = data[i].subString;

                if (dataString.indexOf(data[i].subString) !== -1) {
                    return data[i].identity;
                }
            }
        },
        searchVersion: function (dataString) {
            var index = dataString.indexOf(this.versionSearchString);
            if (index === -1) {
                return;
            }

            var rv = dataString.indexOf("rv:");
            if (this.versionSearchString === "Trident" && rv !== -1) {
                return parseFloat(dataString.substring(rv + 3));
            } else {
                return parseFloat(dataString.substring(index + this.versionSearchString.length + 1));
            }
        },

        dataBrowser: [
            {string: navigator.userAgent, subString: "Edge", identity: "MS Edge"},
            {string: navigator.userAgent, subString: "MSIE", identity: "Explorer"},
            {string: navigator.userAgent, subString: "Trident", identity: "Explorer"},
            {string: navigator.userAgent, subString: "Firefox", identity: "Firefox"},
            {string: navigator.userAgent, subString: "Opera", identity: "Opera"},  
            {string: navigator.userAgent, subString: "OPR", identity: "Opera"},  

            {string: navigator.userAgent, subString: "Chrome", identity: "Chrome"}, 
            {string: navigator.userAgent, subString: "Safari", identity: "Safari"}       
        ]
    };

    BrowserDetect.init();


    var bv= BrowserDetect.browser;
    if( bv == "Chrome"){
        $("body").addClass("chrome");
    }
    else if(bv == "MS Edge"){
     $("body").addClass("edge");
    }
    else if(bv == "Explorer"){
     $("body").addClass("ie");
    }
    else if(bv == "Firefox"){
     $("body").addClass("Firefox");
    }


$(".relative").click(function(){
$(".oc").toggle('slide', { direction: 'left', mode: 'show' }, 500);
$(".oc1").css({
   'width' : '100%',
   'margin-left' : '0px',
   });
});

Questo combina sia la risposta originale di Rob che l'aggiornamento di Pilau per il 2016

    var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
    // Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
var isFirefox = typeof InstallTrigger !== 'undefined';   // Firefox 1.0+
var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
    // At least Safari 3+: "[object HTMLElementConstructor]"
var isChrome = !!window.chrome && !isOpera;              // Chrome 1+
var isIE = /*@cc_on!@*/false || !!document.documentMode;
// Edge 20+
var isEdge = !isIE && !!window.StyleMedia;
// Chrome 1+
var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isIE Edge: ' + isEdge + '<br>';
document.body.innerHTML = output;

Qui scopri quale browser è in esecuzione.

function isValidBrowser(navigator){

            var isChrome =  navigator.indexOf('chrome'),
            isFireFox= navigator.indexOf('firefox'),
            isIE = navigator.indexOf('trident') ,
            isValidChromeVer = parseInt(navigator.substring(isChrome+7, isChrome+8)) >= 4,
            isValidFireForVer = parseInt(navigator.substring(isFireFox+8, isFireFox+9)) >= 3,
            isValidIEVer = parseInt(navigator.substring(isIE+8, isIE+9)) >= 7;

            if((isChrome > -1 && isValidChromeVer){ console.log("Chrome Browser")}

            if(isFireFox > -1 && isValidFireForVer){ console.log("FireFox  Browser")}

            if(isIE > -1 && isValidIEVer)){ console.log("IE Browser")}


        }

Possiamo usare i seguenti metodi util

utils.isIE = function () {
        var ver = navigator.userAgent;
        return ver.indexOf("MSIE") !== -1 || ver.indexOf("Trident") !== -1; // need to check for Trident for IE11
    };

    utils.isIE32 = function () {
        return (utils.isIE() && navigator.appVersion.indexOf('Win64') === -1);
    };

    utils.isChrome = function () {
        return (window.chrome);
    };

    utils.isFF64 = function () {
        var agent = navigator.userAgent;
        return (agent.indexOf('Win64') >= 0 && agent.indexOf('Firefox') >= 0);
    };

    utils.isFirefox = function () {
        return (navigator.userAgent.toLowerCase().indexOf('firefox') > -1);
    };

const isChrome = /Chrome/.test(navigator.userAgent)
const isFirefox = /Firefox/.test(navigator.userAgent)

Una semplice riga di codice JavaScript ti darà il nome del browser:

function GetBrowser()
{
    return  navigator ? navigator.userAgent.toLowerCase() : "other";
}