Wie kann man die Version eines Browsers erkennen?

Question

Ich habe nach einem Code gesucht, mit dem ich erkennen kann, ob der Benutzer, der die Website besucht, Firefox 3 oder 4 hat. Alles, was ich gefunden habe, ist Code zur Erkennung des Browsertyps, aber nicht der Version.

Wie kann ich die Version eines solchen Browsers erkennen?

Answer 1

Sie können sehen, was der Browser sagt und verwenden Sie diese Informationen für die Protokollierung oder für Tests mit mehreren Browsern.

navigator.sayswho= (function(){
    var ua= navigator.userAgent;
    var tem; 
    var 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`

Answer 2

Dies ist eine Verbesserung gegenüber der Antwort von Kennebec.

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'

console.log(browser);

Auf diese Weise können Sie sich vor der Unübersichtlichkeit des Codes schützen.

Answer 3

Hier sind einige bekannte Bibliotheken, die ab Mai 2019 die Browsererkennung übernehmen.

Bowser von lancedikson - 3,761s - Zuletzt aktualisiert am 26. Mai 2019 - 4.8KB

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>

*unterstützt Edge auf Basis von Chromium

---

Plattform.js von bestiejs - 2,250s - Zuletzt aktualisiert am 30. Oktober 2018 - 5.9KB

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 von gabceb - 504s - Zuletzt aktualisiert am 23. November 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 (archiviert) von darcyclarke - 522s - Zuletzt aktualisiert am 26. Oktober 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 (archiviert) von QuirksMode - Aktualisiert am 14. November 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>

---

Bemerkenswerte Erwähnungen:

• WhichBrowser - 1,355s - Letzte Aktualisierung am 2. Oktober 2018
• Modernizr - 23,397s - Aktualisiert am 12. Januar 2019 - Um ein gefüttertes Pferd zu füttern, sollte die Merkmalserkennung jede kannIe Stilfragen. Die Browsererkennung dient eigentlich nur dazu, angepasste Bilder, Download-Dateien oder Anweisungen für einzelne Browser bereitzustellen.

Weitere Lektüre

• Stapelüberlauf - Browser-Erkennung in JavaScript?
• Stapelüberlauf - Wie werden die Browser Safari, Chrome, IE, Firefox und Opera erkannt?

Answer 4

Dies kombiniert die Antwort von kennebec (K) mit der Antwort von Hermann Ingjaldsson (H):

• Behält den minimalen Code der ursprünglichen Antwort bei. (K)
• Funktioniert mit Microsoft Edge (K)
• Erweitert das Navigator-Objekt, anstatt eine neue Variable/ein neues Objekt zu erstellen. (K)

• Trennt Browserversion und Name in unabhängige untergeordnete Objekte. (H)

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

Answer 5

Les bowser JavaScript-Bibliothek bietet diese Funktionalität.

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

Sie scheint gut gepflegt zu sein.