javascript - JavaScript または jQuery を使用して Mac OS X または Windows コンピュータを検出する最良の方法

Question

そのため、ユーザーが Mac を使用している場合は左側に、ユーザーが PC を使用している場合は右側に「閉じる」ボタンを移動しようとしています。現在、ユーザー エージェントを調べることでそれを行っていますが、OS を確実に検出するにはあまりにも簡単に偽装される可能性があります。ブラウザが実行されている OS が Mac OS X か Windows かを確実に検出する方法はありますか? そうでない場合、ユーザー エージェントのスニッフィングより優れているものはありますか?

Answer 1

userAgent 文字列が変更されても、window.navigator.platform プロパティはスプーフィングされません。userAgent を iPhone または Chrome Windows に変更した場合、Mac でテストしましたが、navigator.platformは MacIntel のままです。

プロパティも読み取り専用です

---

次の表を思いつくことができました

Mac コンピューター

Mac68K Macintosh 68K システム。
MacPPC Macintosh PowerPC システム。
MacIntel マッキントッシュ インテル システム。

iOS デバイス

iPhone アイフォン。
iPod アイポッドタッチ。
iPad iPad。

---

最新の macs が戻ってきましたが、navigator.platform == "MacIntel"「将来の証明」を与えるために完全一致を使用しないでください。MacARMMacQuantum

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

「左側」も使用する iOS を含めるには

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>

---

ほとんどの OS は右側の閉じるボタンを使用するため、ユーザーが MacLike OS を使用している場合は、閉じるボタンを左に移動するだけで済みます。それ以外の場合は、最も一般的な右側に配置しても問題ありません。

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/

Answer 2

それはそれと同じくらい簡単です：

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

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

Answer 3

これはあなたが探しているものですか？それ以外の場合はお知らせください。この投稿を削除します。

この jQuery プラグインを試してください: http://archive.plugins.jquery.com/project/client-detect

デモ: http://www.stoimen.com/jquery.client.plugin/

これは、jQuery ブラウザー/OS 検出プラグインのラップである quirksmode BrowserDetect に基づいています。

熱心な読者向け:
http://www.stoimen.com/blog/2009/07/16/jquery-browser-and-os-detection-plugin/
http://www.quirksmode.org/js/support.html

プラグインに関するその他のコードは、http://www.stoimen.com/jquery.client.plugin/jquery.client.js にあります。

Answer 4

補足:一部のブラウザnavigator.userAgentData.platformは、読み取り専用プロパティである をサポートしています。

console.log(navigator.userAgentData.platform);
// macOs

Navigator.platform は非推奨であることに注意してください。

Answer 5

MacIntelハードウェア アーキテクチャに関係なく、すべての Chrome または Chromium ベースのブラウザが macOS プラットフォームに戻ると思います。

詳細については、Chromium ソース コードを確認してください。