среда, 13 апреля 2016 г.

JavaScript Browser Detection

github.com/ded/bowser/blob/master/bowser.js
useragentstring.com/pages/useragentstring.php

Here's how to detect browsers in 2016, including Microsoft Edge and detection of Blink:

// 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';

// At least Safari 3+: "[object HTMLElementConstructor]"
isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;

// At least IE6
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;

The beauty of this approach is that it relies on browser engine properties, so it covers even derivative browsers, such as Yandex or Vivaldi, which are practically compatible with the major browsers whose engines they use. The exception is Opera, which is detected via user agent sniffing, but today (i.e. ver. 15 and up) even Opera is itself only a shell for Blink.

But it is better and universal solution!

// Returns an object with name and version of browser.
// Compatable across roughly 99.8% browsers.
function getBrowserInfo (userAgent) {
    var matchedUserAgent = userAgent.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [] // ["MSIE 7", "MSIE", "7"]
        , temp
        , browser = {
              name: undefined
            , version: undefined
            , platform: navigator.platform
        };
    // Trident check (IE 11 and below)
    if (/trident/i.test(matchedUserAgent[1])) { // ["Trident/7", "Trident", "7"]
        temp = /\brv[ :]+(\d+)/g.exec(userAgent) || []; // ["rv:11", "11"]
        browser.name = 'MSIE'; // mark IE browser as MSIE
        browser.version = (parseInt(temp[1], 10) || 0);
    } else if (matchedUserAgent[1] === 'Chrome') { // ["Chrome/48", "Chrome", "48"]
        temp = userAgent.match(/\bOPR\/(\d+)/); // ["OPR/35", "OPR", "35"]
        if (temp !== null) {
            browser.name = 'Opera';
            browser.version = parseInt(temp[1], 10);
        } else {
            browser.name = 'MSIE' // matchedUserAgent[1]; // mark Edge browser as MSIE
            browser.version = parseInt(matchedUserAgent[2], 10);
        }
    } else {
        if (matchedUserAgent[2]) { // ["Chrome/48", "Chrome", "48"]
            matchedUserAgent = [matchedUserAgent[1], matchedUserAgent[2]]; // ["Chrome", "48"]
        } else { // ["Firefox", undefined]
            matchedUserAgent = [navigator.appName, navigator.appVersion, '-?']; // ["Netscape", "5.0 (Windows)", "-?"]
        }
        temp = userAgent.match(/version\/(\d+)/i);
        if (temp !== null) {
            matchedUserAgent.splice(1, 1, temp[1]);
        }
        browser.name = matchedUserAgent[0];
        browser.version = parseInt(matchedUserAgent[1], 10);
    }
    return browser;
}

var ua1 = 'Mozilla/5.0 (iPad; CPU OS 7_1_1 like Mac OS X) AppleWebKit/537.51.2 (KHTML, like Gecko) Mobile/11D201'
    , ua2 = 'Mozilla/5.0 (iPad; CPU OS_7_1_1 like Mac OS X) AppleWebKit/537.51.2 (KHTML, like Gecko) Version/7.0 Mobile/11D201 Safari/9537.53'
    , ua3 = navigator.userAgent
    , b1 = getBrowserInfo(ua1)
    , b2 = getBrowserInfo(ua2)
    , b3 = getBrowserInfo(ua3);

console.log('1', b1);
console.log('2', b2);
console.log('3', b3);

Original code

navigator.browser = (function(){
    var ua = navigator.userAgent,
          tem,
          M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
    if (/trident/i.test(M[1])) {
        tem =  /\brv[ :]+(\d+)/g.exec(ua) || [];
        return 'IE '+(tem[1] || '');
    }
    if (M[1] === 'Chrome') {
        tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
        if(tem != null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
    }
    M= M[2] ? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
    if ((tem = ua.match(/version\/(\d+)/i)) != null) M.splice(1, 1, tem[1]);
    return M.join(' ');
})();

Комментариев нет:

Отправить комментарий