Come rilevare la versione del browser e il sistema operativo utilizzando JavaScript?


113

Ho provato a utilizzare il codice qui sotto ma mostra solo i risultati in Chrome e Mozilla che non funzionano in IE6.

<div id="example"></div>

<script type="text/javascript">

txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";

document.getElementById("example").innerHTML=txt;

</script>

Produzione:

Browser CodeName: Mozilla

Browser Name: Netscape

Browser Version: 5.0 (Windows)

Cookies Enabled: true

Platform: Win32

User-agent header: Mozilla/5.0 (Windows NT 5.1; rv:12.0) Gecko/20100101 Firefox/12.0

Ho bisogno solo della versione "Firefox / 12.0".


3
quirksmode.org/js/detect.html per favore controllalo una volta che questo potrebbe aiutarti ..
Jalpesh Patel

Ulteriori risposte pertinenti possono essere trovate su questo e questo `` quasi '' dupes
Matthijs Wessels

Controlla la mia risposta da questo link ( stackoverflow.com/questions/9847580/… )
Malki Mohamed,

Risposte:


167

Rilevamento dei dettagli del browser:

var nVer = navigator.appVersion;
var nAgt = navigator.userAgent;
var browserName  = navigator.appName;
var fullVersion  = ''+parseFloat(navigator.appVersion); 
var majorVersion = parseInt(navigator.appVersion,10);
var nameOffset,verOffset,ix;

// In Opera, the true version is after "Opera" or after "Version"
if ((verOffset=nAgt.indexOf("Opera"))!=-1) {
 browserName = "Opera";
 fullVersion = nAgt.substring(verOffset+6);
 if ((verOffset=nAgt.indexOf("Version"))!=-1) 
   fullVersion = nAgt.substring(verOffset+8);
}
// In MSIE, the true version is after "MSIE" in userAgent
else if ((verOffset=nAgt.indexOf("MSIE"))!=-1) {
 browserName = "Microsoft Internet Explorer";
 fullVersion = nAgt.substring(verOffset+5);
}
// In Chrome, the true version is after "Chrome" 
else if ((verOffset=nAgt.indexOf("Chrome"))!=-1) {
 browserName = "Chrome";
 fullVersion = nAgt.substring(verOffset+7);
}
// In Safari, the true version is after "Safari" or after "Version" 
else if ((verOffset=nAgt.indexOf("Safari"))!=-1) {
 browserName = "Safari";
 fullVersion = nAgt.substring(verOffset+7);
 if ((verOffset=nAgt.indexOf("Version"))!=-1) 
   fullVersion = nAgt.substring(verOffset+8);
}
// In Firefox, the true version is after "Firefox" 
else if ((verOffset=nAgt.indexOf("Firefox"))!=-1) {
 browserName = "Firefox";
 fullVersion = nAgt.substring(verOffset+8);
}
// In most other browsers, "name/version" is at the end of userAgent 
else if ( (nameOffset=nAgt.lastIndexOf(' ')+1) < 
          (verOffset=nAgt.lastIndexOf('/')) ) 
{
 browserName = nAgt.substring(nameOffset,verOffset);
 fullVersion = nAgt.substring(verOffset+1);
 if (browserName.toLowerCase()==browserName.toUpperCase()) {
  browserName = navigator.appName;
 }
}
// trim the fullVersion string at semicolon/space if present
if ((ix=fullVersion.indexOf(";"))!=-1)
   fullVersion=fullVersion.substring(0,ix);
if ((ix=fullVersion.indexOf(" "))!=-1)
   fullVersion=fullVersion.substring(0,ix);

majorVersion = parseInt(''+fullVersion,10);
if (isNaN(majorVersion)) {
 fullVersion  = ''+parseFloat(navigator.appVersion); 
 majorVersion = parseInt(navigator.appVersion,10);
}

document.write(''
 +'Browser name  = '+browserName+'<br>'
 +'Full version  = '+fullVersion+'<br>'
 +'Major version = '+majorVersion+'<br>'
 +'navigator.appName = '+navigator.appName+'<br>'
 +'navigator.userAgent = '+navigator.userAgent+'<br>'
)

Fonte JavaScript: nome del browser .
Vedere JSFiddle per rilevare i dettagli del browser .

Rilevamento del sistema operativo:

// This script sets OSName variable as follows:
// "Windows"    for all versions of Windows
// "MacOS"      for all versions of Macintosh OS
// "Linux"      for all versions of Linux
// "UNIX"       for all other UNIX flavors 
// "Unknown OS" indicates failure to detect the OS

var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";

document.write('Your OS: '+OSName);

sorgente JavaScript: rilevamento del sistema operativo .
Vedere JSFiddle per rilevare i dettagli del sistema operativo .


1
Sai dove posso trovare tutti i possibili valori di appVersion? Bene tutti i possibili valori del sistema operativo che appVersion utilizza?
John Odom

3
@JohnOdom I nuovi sistemi (ad esempio l'imminente Steam box) hanno probabilmente i loro nomi; ei sistemi esistenti potrebbero cambiare i loro nomi o abbreviazioni. Non sarai mai aggiornato, a meno che tu non usi una sorta di database globale da cui ottenere quelle informazioni; poiché questo è interamente proprietario. Forse un giorno Google, W3 ecc. Offriranno un'API per il crowdsourcing e renderanno disponibili pubblicamente tutti i diversi nomi di sistema e le loro relazioni che raccolgono dai loro utenti.
Domi

1
verOffset = nAgt.indexOf ( "Opera")) = - 1. Questo non funzionerà per Opera 20 e versioni successive.
parth.hirpara

2
Impossibile rilevare Edge.
Mohan Singh

1
Questo Javascript non è aggiornato. Segnala Edge e IE 11 come "Netscape 5". Suggerisci di utilizzare una libreria mantenuta per questa funzionalità come github.com/faisalman/ua-parser-js
James Boutcher

20

Mi dispiace dirlo: questa volta siamo sfortunati.

Vorrei rimandarti all'autore di WhichBrowser : Everybody lies .

Fondamentalmente, nessun browser è onesto. Non importa se utilizzi Chrome o IE, entrambi ti diranno che sono "Mozilla Netscape" con supporto per Gecko e Safari. Provalo tu stesso su uno qualsiasi dei violini che volano in questo thread:

Il violino di hims056

Il violino di Hariharan

o qualsiasi altro ... Provalo con Chrome (che potrebbe ancora funzionare), quindi provalo con una versione recente di IE e piangerai. Certo, ci sono euristiche, per farlo bene, ma sarà noioso afferrare tutti i casi limite e molto probabilmente non funzioneranno più tra un anno.

Prendi il tuo codice, ad esempio:

<div id="example"></div>
<script type="text/javascript">
txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
document.getElementById("example").innerHTML=txt;
</script>

Chrome dice:

Nome in codice del browser: Mozilla

Nome del browser: Netscape

Versione browser: 5.0 (Windows NT 6.1; WOW64) AppleWebKit / 537.36 (KHTML, come Gecko) Chrome / 40.0.2214.115 Safari / 537.36

Cookie abilitati: true

Piattaforma: Win32

Intestazione agente utente: Mozilla / 5.0 (Windows NT 6.1; WOW64) AppleWebKit / 537.36 (KHTML, come Gecko) Chrome / 40.0.2214.115 Safari / 537.36

IE dice:

Nome in codice del browser: Mozilla

Nome del browser: Netscape

Versione browser: 5.0 (Windows NT 6.1; WOW64; Trident / 7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4 .0E; InfoPath.3; rv: 11.0) come Gecko

Cookie abilitati: true

Piattaforma: Win32

Intestazione agente utente: Mozilla / 5.0 (Windows NT 6.1; WOW64; Trident / 7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4. 0C; .NET4.0E; InfoPath.3; rv: 11.0) come Gecko

Almeno Chrome ha ancora una stringa che contiene "Chrome" con il numero di versione esatto. Ma, per IE, devi estrapolare dalle cose che supporta per capirlo effettivamente (chi altro si vanta di supportare .NETo Media Center: P), e poi confrontarlo con il rv:alla fine per ottenere il numero di versione. Naturalmente, anche un'euristica così sofisticata potrebbe molto probabilmente fallire non appena uscirà IE 12 (o come lo vogliono chiamare).


2
Visualizza Chrome per il browser Opera.
Rajkishor Sahu,

alcune di queste proprietà sono "mantenute per compatibilità con le versioni precedenti", ad esempio tutti i browser restituiranno "Netscape" per navigator.appNamedeveloper.mozilla.org/en-US/docs/Web/API/NavigatorID
Philipp

18

Esiste una libreria per questo scopo: https://github.com/bestiejs/platform.js#readme

Quindi puoi usarlo in questo modo

// example 1
platform.os; // 'Windows Server 2008 R2 / 7 x64'

// example 2 on an iPad
platform.os; // 'iOS 5.0'

// you can also access on the browser and some other properties
platform.name; // 'Safari'
platform.version; // '5.1'
platform.product; // 'iPad'
platform.manufacturer; // 'Apple'
platform.layout; // 'WebKit'

// or use the description to put all together
platform.description; // 'Safari 5.1 on Apple iPad (iOS 5.0)'

1
Nota che da tutti i collegamenti alle librerie github nelle risposte qui, questa libreria sembra essere la più aggiornata (Scritto a maggio 2018, con l'ultimo commit "3 mesi fa")
Ideogramma

12

Per rilevare il sistema operativo utilizzando JavaScript è meglio utilizzare navigator.userAgent invece di navigator.appVersion

{
  var OSName = "Unknown OS";
  if (navigator.userAgent.indexOf("Win") != -1) OSName = "Windows";
  if (navigator.userAgent.indexOf("Mac") != -1) OSName = "Macintosh";
  if (navigator.userAgent.indexOf("Linux") != -1) OSName = "Linux";
  if (navigator.userAgent.indexOf("Android") != -1) OSName = "Android";
  if (navigator.userAgent.indexOf("like Mac") != -1) OSName = "iOS";
  console.log('Your OS: ' + OSName);
}


1
Upvoting. Inoltre, sarebbe molto utile se tu potessi spiegare perché esattamente è meglio :) Inoltre, sembra che "UNIX / X11" manchi.
Riavvio dei sistemi

@SystemsRebooter Grazie per il commento puoi aggiungere quelli come gli altri.
Nisal Edu

1
ottima risposta, questo è stato molto utile
Jeremy Bader

9

Lo script di PPK è l'autorità per questo tipo di cose, come ha detto @Jalpesh, questo potrebbe indicarti nel modo giusto

var wn = window.navigator,
        platform = wn.platform.toString().toLowerCase(),
        userAgent = wn.userAgent.toLowerCase(),
        storedName;

// ie
    if (userAgent.indexOf('msie',0) !== -1) {
        browserName = 'ie';
        os = 'win';
        storedName = userAgent.match(/msie[ ]\d{1}/).toString();
        version = storedName.replace(/msie[ ]/,'');

        browserOsVersion = browserName + version;
    }

Tratto da https://github.com/leopic/jquery.detectBrowser.js/blob/sans-jquery/jquery.detectBrowser.sansjQuery.js


2

Prova questo..

// Browser with version  Detection
navigator.sayswho= (function(){
    var N= navigator.appName, ua= navigator.userAgent, tem;
    var M= ua.match(/(opera|chrome|safari|firefox|msie)\/?\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;
})();

var browser_version          = navigator.sayswho;
alert("Welcome to " + browser_version);

guarda il violino funzionante ( qui )


2

Per Firefox, Chrome, Opera, Internet Explorer e Safari

var ua="Mozilla/1.22 (compatible; MSIE 10.0; Windows 3.1)";
//ua = navigator.userAgent;
var b;
var browser;
if(ua.indexOf("Opera")!=-1) {

    b=browser="Opera";
}
if(ua.indexOf("Firefox")!=-1 && ua.indexOf("Opera")==-1) {
    b=browser="Firefox";
    // Opera may also contains Firefox
}
if(ua.indexOf("Chrome")!=-1) {
    b=browser="Chrome";
}
if(ua.indexOf("Safari")!=-1 && ua.indexOf("Chrome")==-1) {
    b=browser="Safari";
    // Chrome always contains Safari
}

if(ua.indexOf("MSIE")!=-1 && (ua.indexOf("Opera")==-1 && ua.indexOf("Trident")==-1)) {
    b="MSIE";
    browser="Internet Explorer";
    //user agent with MSIE and Opera or MSIE and Trident may exist.
}

if(ua.indexOf("Trident")!=-1) {
    b="Trident";
    browser="Internet Explorer";
}

// now for version


var version=ua.match(b+"[ /]+[0-9]+(.[0-9]+)*")[0];

console.log("broswer",browser);
console.log("version",version);

4
aggiungilo alla console in Chrome e ottieni "Safari / 537.36"
Daniel_Madain

Questo fallirà in Chrome e forse in altri browser. Poiché la stringa UserAgent non è una risorsa completamente affidabile. I fornitori di browser spesso includono informazioni fuorvianti al suo interno.
Carlos Jimenez Bermudez

1

Non sono riuscito a far funzionare alcune delle altre risposte su Chrome, Firefox, IE11 e Edge con lo stesso codice. Ho trovato il seguente e sembra funzionare per i browser sopra elencati. Volevo anche vedere su quale sistema operativo si trovava l'utente. Non l'ho testato su un browser con impostazioni utente-agente sostituite dall'utente, quindi il chilometraggio può variare. L'ordine degli IF è importante affinché funzioni correttamente.

let os, osStore, bStore, appVersion, browser;
// Chrome
if(navigator.vendor === "Google Inc."){
    appVersion = navigator.appVersion.split(" ");
    os = [appVersion[1],appVersion[2],appVersion[3],appVersion[4],appVersion[5]].join(" ");
    os = os.split("(")[1].split(")")[0]
    browser = appVersion[appVersion.length-2].split("/").join(" ");
    console.log("Browser:",browser,"- OS:",os);
}

// Safari
else if(navigator.vendor === "Apple Computer, Inc."){
    appVersion = navigator.appVersion.split(" ");
    os = [appVersion[1],appVersion[2],appVersion[3],appVersion[4],appVersion[5]].join(" ");
    os = os.split("(")[1].split(")")[0];
    browser = appVersion[appVersion.length-1].split("/").join(" ");
    console.log("Browser:",browser,"- OS:",os);
}

// Firefox is seems the only browser with oscpu
else if(navigator.oscpu){
    bStore = navigator.userAgent.split("; ").join("-").split(" ");
    browser = bStore[bStore.length-1].replace("/"," ");
    osStore = [bStore[1],bStore[2],bStore[3]].join(" ");
    osStore = osStore.split("-");
    osStore.pop(osStore.lastIndexOf)
    osStore = osStore.join(" ").split("(");
    os = osStore[1];
    console.log("Browser:",browser,"- OS:",os);
}

// IE is seems the only browser with cpuClass
// MSIE 11:10 Mode
else if(navigator.appName === "Microsoft Internet Explorer"){
    bStore = navigator.appVersion.split("; ");
    browser = bStore[1]+" / "+bStore[4].replace("/"," ");
    os = [bStore[2],bStore[3]].join(" ");
    console.log("Browser:",browser,"- OS:",os);
}

// MSIE 11
else if(navigator.cpuClass){
    bStore = navigator.appVersion.split("; ");
    osStore = [bStore[0],bStore[1]].join(" ");
    os = osStore.split("(")[1];
    browser = "MSIE 11 "+bStore[2].split("/").join(" ");
    console.log("Browser:",browser,"- OS:",os);
}

// Edge
else if(navigator.appVersion){
    browser = navigator.appVersion.split(" ");
    browser = browser[browser.length -1].split("/").join(" ");
    os = navigator.appVersion.split(")")[0].split("(")[1];
    console.log("Browser:",browser,"- OS:",os);
}

// Other browser
else {
    console.log(JSON.stringify(navigator));
}

0

Codice per rilevare il sistema operativo di un utente

let os = navigator.userAgent.slice(13).split(';')
os = os[0]
console.log(os)
Windows NT 10.0

0

Per ottenere il nuovo Microsoft Edge basato su un core Mozilla, aggiungi:

else if ((verOffset=nAgt.indexOf("Edg"))!=-1) {
 browserName = "Microsoft Edge";
 fullVersion = nAgt.substring(verOffset+5);
}

prima

// In Chrome, the true version is after "Chrome" 
else if ((verOffset=nAgt.indexOf("Chrome"))!=-1) {
 browserName = "Chrome";
 fullVersion = nAgt.substring(verOffset+7);
}
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.