Как вы можете определить версию браузера? - PullRequest
Новая
       137

Как вы можете определить версию браузера?

262 голосов
/ 07 мая 2011

Я искал код, который позволил бы мне определить, есть ли у пользователя, посещающего веб-сайт, Firefox 3 или 4. Все, что я нашел, это код для определения типа браузера, но не версии.* Как я могу определить версию браузера, подобную этой?

Ответы [ 25 ]

466 голосов
/ 07 мая 2011

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

navigator.sayswho= (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(' ');
})();

console.log(navigator.sayswho); // outputs: `Chrome 62`
197 голосов
/ 05 июня 2013

Это улучшение ответа Кеннебека. 

function get_browser() {
    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 {name:'IE',version:(tem[1]||'')};
        }   
    if(M[1]==='Chrome'){
        tem=ua.match(/\bOPR|Edge\/(\d+)/)
        if(tem!=null)   {return {name:'Opera', version:tem[1]};}
        }   
    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 {
      name: M[0],
      version: M[1]
    };
 }

И тогда вы просто запускаете: 

var browser=get_browser();
// browser.name = 'Chrome'
// browser.version = '40'

Таким образом, вы можете защитить себя от мрака кода.*

47 голосов
/ 28 июня 2016

Это объединяет ответ Кеннебека (K) с ответом Германа Ингальдссона (H):

  • Поддерживает минимальный код исходного ответа. (К)
  • Работает с Microsoft Edge (K)
  • Расширяет объект навигатора вместо создания новой переменной / объекта. (К)
  • Разделяет версию и имя браузера на независимые дочерние объекты. (Н) 

navigator.browserSpecs = (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 {name:'IE',version:(tem[1] || '')};
    }
    if(M[1]=== 'Chrome'){
        tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
        if(tem != null) return {name:tem[1].replace('OPR', 'Opera'),version:tem[2]};
    }
    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 {name:M[0], version:M[1]};
})();

console.log(navigator.browserSpecs); //Object { name: "Firefox", version: "42" }

if (navigator.browserSpecs.name == 'Firefox') {
    // Do something for Firefox.
    if (navigator.browserSpecs.version > 42) {
        // Do something for Firefox versions greater than 42.
    }
}
else {
    // Do something for all other browsers.
}
24 голосов
/ 03 ноября 2015

bowser Библиотека JavaScript предлагает эту функцию. 

if (bowser.msie && bowser.version <= 6) {
  alert('Hello China');
}

Кажется, в хорошем состоянии.

22 голосов
/ 31 марта 2018

Вот несколько известных библиотек, которые обрабатывают обнаружение браузера по состоянию на май 2019 года.

Bowser от lancedikson - 3761 ★ s - Последнее обновление 26 мая 2019 г. - 4,8 КБ 

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.4.0/es5.js"></script>

* поддерживает Edge на основе хрома

Platform.js by bestiejs- 2250 ★ с - Последнее обновление 30 октября 2018 г. - 5,9 КБ 

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 от gabceb - 504 ★ s - последнее обновление 23 ноября 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 (в архиве) от darcyclarke - 522 ★ s - последнее обновление 26 октября 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>

Обнаружение браузера (в архиве) от QuirksMode - последнее обновление 14 ноября 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>

Известные упоминания:

  • WhichBrowser - 1355 ★ s - последнее обновление 2 октября,2018
  • Modernizr - 23 397 ★ s - Последнее обновление: 12 января 2019 г. - Чтобы прокормить лошадь, которой кормят, при обнаружении функций должны возникать любые вопросы в стиле canIuse .Обнаружение браузера действительно предназначено только для предоставления настроенных изображений, загрузки файлов или инструкций для отдельных браузеров.

Дальнейшее чтение

18 голосов
/ 07 мая 2011

Используйте это: http://www.quirksmode.org/js/detect.html

alert(BrowserDetect.browser); // will say "Firefox"
alert(BrowserDetect.version); // will say "3" or "4"
16 голосов
/ 25 апреля 2013

Я искал решение для себя, поскольку jQuery 1.9.1 и выше удалили функциональность $.browser. Я придумал эту маленькую функцию, которая работает для меня. Ему нужна глобальная переменная (я назвал мой _browser), чтобы проверить, какой это браузер. Я написал jsfiddle , чтобы проиллюстрировать, как его можно использовать, конечно, его можно расширить для других браузеров, просто добавив тест для _browser.foo, где foo - имя браузера. Я сделал только популярные.

detectBrowser () 

_browser = {};

function detectBrowser() {
  var uagent = navigator.userAgent.toLowerCase(),
      match = '';

  _browser.chrome  = /webkit/.test(uagent)  && /chrome/.test(uagent)      &&
                     !/edge/.test(uagent);

  _browser.firefox = /mozilla/.test(uagent) && /firefox/.test(uagent);

  _browser.msie    = /msie/.test(uagent)    || /trident/.test(uagent)     ||
                     /edge/.test(uagent);

  _browser.safari  = /safari/.test(uagent)  && /applewebkit/.test(uagent) &&
                     !/chrome/.test(uagent);

  _browser.opr     = /mozilla/.test(uagent) && /applewebkit/.test(uagent) &&
                     /chrome/.test(uagent)  && /safari/.test(uagent)      &&
                     /opr/.test(uagent);

  _browser.version = '';

  for (x in _browser) {
    if (_browser[x]) {

      match = uagent.match(
                new RegExp("(" + (x === "msie" ? "msie|edge" : x) + ")( |\/)([0-9]+)")
              );

      if (match) {
        _browser.version = match[3];
      } else {
        match = uagent.match(new RegExp("rv:([0-9]+)"));
        _browser.version = match ? match[1] : "";
      }
      break;
    }
  }
  _browser.opera = _browser.opr;
  delete _browser.opr;
}

Чтобы проверить, является ли текущий браузер Opera, вы должны сделать 

if (_browser.opera) { // Opera specific code }

Редактировать Исправлено форматирование, исправлено обнаружение для IE11 и Opera / Chrome, изменено на browserResult from result. Теперь порядок клавиш _browser не имеет значения. Обновлена ​​ jsFiddle ссылка.

2015/08/11 Редактировать Добавлен новый тестовый пример для Internet Explorer 12 (EDGE), исправлена ​​небольшая проблема с регулярным выражением. Обновлена ​​ jsFiddle ссылка.

11 голосов
/ 04 сентября 2014 
function BrowserCheck()
{
    var N= navigator.appName, ua= navigator.userAgent, tem;
    var M= ua.match(/(opera|chrome|safari|firefox|msie|trident)\/?\s*(\.?\d+(\.\d+)*)/i);
    if(M && (tem= ua.match(/version\/([\.\d]+)/i))!= null) {M[2]=tem[1];}
    M= M? [M[1], M[2]]: [N, navigator.appVersion,'-?'];
    return M;
}

Это вернет массив, первый элемент - это имя браузера, второй элемент - полный номер версии в строковом формате.

9 голосов
/ 07 мая 2011

jQuery может справиться с этим довольно приятно ( jQuery.browser ) 

var ua = $.browser;
if ( ua.mozilla && ua.version.slice(0,3) == "1.9" ) {
    alert( "Do stuff for firefox 3" );
}

РЕДАКТИРОВАТЬ: Как писал Джошуа в своем комментарии ниже, jQuery.browser больше не поддерживается в jQuery начиная с версии 1.9 (для получения более подробной информации читайте примечания к выпуску jQuery 1.9 ).Команда разработчиков jQuery рекомендует , используя более полный подход, такой как адаптация интерфейса с библиотекой Modernizr .

7 голосов
/ 07 мая 2011

В чистом Javascript вы можете выполнить поиск RegExp на navigator.userAgent, чтобы найти версию Firefox: 

var uMatch = navigator.userAgent.match(/Firefox\/(.*)$/),
    ffVersion;
if (uMatch && uMatch.length > 1) {
    ffVersion = uMatch[1];
}

ffVersion будет undefined, если не браузер Firefox.

См. Рабочий пример →

Страница:
...