Meilleur moyen de détecter les ordinateurs Mac OS X ou Windows avec JavaScript ou jQuery

J'essaye donc de déplacer un bouton «fermer» vers le côté gauche lorsque l'utilisateur est sur Mac et le côté droit lorsque l'utilisateur est sur PC. Maintenant, je le fais en examinant l'agent utilisateur, mais il peut être trop facilement usurpé pour une détection fiable du système d'exploitation. Existe-t-il un moyen infaillible de détecter si le système d'exploitation sur lequel le navigateur s'exécute est Mac OS X ou Windows? Sinon, quoi de mieux que le reniflement d'agent utilisateur?

La propriété window.navigator.platform n'est pas usurpée lorsque la chaîne userAgent est modifiée. J'ai testé sur mon Mac si je change le userAgent pour iPhone ou Chrome Windows, navigator.platform reste MacIntel.

La propriété est également en lecture seule

Je pourrais proposer le tableau suivant

Ordinateurs Mac

Mac68K Système Macintosh 68K.
MacPPC Système Macintosh PowerPC.
MacIntel Système Intel Macintosh.

Appareils iOS

iPhone iPhone.
iPod Ipod touch.
iPad iPad.

Les macs modernes sont de retour, navigator.platform == "MacIntel"mais pour donner une "preuve future", n'utilisez pas de correspondance exacte, j'espère qu'ils changeront en quelque chose comme MacARMou MacQuantumdans le futur.

var isMac = navigator.platform.toUpperCase().indexOf('MAC')>=0;

Pour inclure iOS qui utilise également le "côté gauche"

var isMacLike = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);
var isIOS = /(iPhone|iPod|iPad)/i.test(navigator.platform);

var is_OSX = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);
var is_iOS = /(iPhone|iPod|iPad)/i.test(navigator.platform);

var is_Mac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
var is_iPhone = navigator.platform == "iPhone";
var is_iPod = navigator.platform == "iPod";
var is_iPad = navigator.platform == "iPad";

/* Output */
var out = document.getElementById('out');
if (!is_OSX) out.innerHTML += "This NOT a Mac or an iOS Device!";
if (is_Mac) out.innerHTML += "This is a Mac Computer!\n";
if (is_iOS) out.innerHTML += "You're using an iOS Device!\n";
if (is_iPhone) out.innerHTML += "This is an iPhone!";
if (is_iPod) out.innerHTML += "This is an iPod Touch!";
if (is_iPad) out.innerHTML += "This is an iPad!";
out.innerHTML += "\nPlatform: " + navigator.platform;

<pre id="out"></pre>

Étant donné que la plupart des systèmes d'exploitation utilisent le bouton de fermeture à droite, vous pouvez simplement déplacer le bouton de fermeture vers la gauche lorsque l'utilisateur est sur un système d'exploitation MacLike, sinon ce n'est pas un problème si vous le placez du côté le plus courant, à droite.

setTimeout(test, 1000); //delay for demonstration

function test() {

  var mac = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);

  if (mac) {
    document.getElementById('close').classList.add("left");
  }
}

#window {
  position: absolute;
  margin: 1em;
  width: 300px;
  padding: 10px;
  border: 1px solid gray;
  background-color: #DDD;
  text-align: center;
  box-shadow: 0px 1px 3px #000;
}
#close {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 22px;
  height: 22px;
  margin: -12px;
  box-shadow: 0px 1px 3px #000;
  background-color: #000;
  border: 2px solid #FFF;
  border-radius: 22px;
  color: #FFF;
  text-align: center;
  font: 14px"Comic Sans MS", Monaco;
}
#close.left{
  left: 0px;
}

<div id="window">
  <div id="close">x</div>
  <p>Hello!</p>
  <p>If the "close button" change to the left side</p>
  <p>you're on a Mac like system!</p>
</div>

http://www.nczonline.net/blog/2007/12/17/don-t-forget-navigator-platform/

C'est aussi simple que ça:

function isMacintosh() {
  return navigator.platform.indexOf('Mac') > -1
}

function isWindows() {
  return navigator.platform.indexOf('Win') > -1
}

Vous pouvez faire des choses amusantes alors comme:

var isMac = isMacintosh();
var isPC = !isMacintosh();

Est-ce ce que vous recherchez? Sinon, faites-le moi savoir et je supprimerai ce message.

Essayez ce plugin jQuery: http://archive.plugins.jquery.com/project/client-detect

Démo: http://www.stoimen.com/jquery.client.plugin/

Ceci est basé sur quirksmode BrowserDetect une enveloppe pour le plugin de détection de navigateur / os jQuery.

Pour les lecteurs assidus:
http://www.stoimen.com/blog/2009/07/16/jquery-browser-and-os-detection-plugin/
http://www.quirksmode.org/js/support.html

Et plus de code autour du plugin se trouve ici: http://www.stoimen.com/jquery.client.plugin/jquery.client.js

Laissez-moi savoir si cela fonctionne. Méthode de détection d'un appareil Apple (ordinateurs Mac, iPhones, etc.) avec l'aide de StackOverflow.com :
Quelle est la liste des valeurs possibles pour navigator.platform à ce jour?

var deviceDetect = navigator.platform;
var appleDevicesArr = ['MacIntel', 'MacPPC', 'Mac68K', 'Macintosh', 'iPhone', 
'iPod', 'iPad', 'iPhone Simulator', 'iPod Simulator', 'iPad Simulator', 'Pike 
v7.6 release 92', 'Pike v7.8 release 517'];

// If on Apple device
if(appleDevicesArr.includes(deviceDetect)) {
    // Execute code
}
// If NOT on Apple device
else {
    // Execute code
}