Cara terbaik untuk mendeteksi komputer Mac OS X atau Windows dengan JavaScript atau jQuery

110

Jadi saya mencoba untuk memindahkan tombol "tutup" ke sisi kiri saat pengguna menggunakan Mac dan sisi kanan saat pengguna menggunakan PC. Sekarang saya melakukannya dengan memeriksa agen pengguna, tetapi itu dapat dengan mudah dipalsukan untuk deteksi OS yang andal. Adakah cara yang pasti untuk mendeteksi apakah OS yang menjalankan browser adalah Mac OS X atau Windows? Jika tidak, apa yang lebih baik daripada mengendus agen pengguna?

alt
sumber
20
Jika pengguna memanipulasi agen pengguna, bukankah itu masalahnya? Saya akan khawatir jika Anda merasa sedih jika mereka memiliki agen pengguna yang tidak valid (mis. Ketika memberi mereka akses ke sesuatu yang Anda tidak ingin mereka miliki), tetapi untuk sesuatu seperti ini, mengapa Anda stres? Biarkan mereka menembak diri sendiri dan harus menghadapi konsekuensinya - jangan berkeringat, sobat.
Mahmoud Al-Qudsi
lebih seperti tip daripada jawaban. Anda dapat mendeteksi IE dengan komentar bersyarat. ini +1 untuk gudang pendeteksian jendela. tetapi ini akan gagal jika IE dijalankan di emulator di OS lain (seperti Wine di Linux). Ngomong-ngomong, bagaimana dengan linux?
Joseph
@ MahmoudAl-Qudsi Meskipun tanpa spoofing, Firefox seluler sering berpura-pura sebagai Safari, Opera sering berpura-pura sebagai firefox dalam beberapa versi. Tanpa spoofing, agen pengguna masih SANGAT tidak dapat diandalkan.
alt
Kemungkinan duplikat: stackoverflow.com/q/7044944/55209
Artem Koshelev
Tapi jawaban pertanyaan itu hanyalah "agen pengguna".
alt

Jawaban:

192

The window.navigator.platform properti tidak palsu ketika string useragent berubah. Saya menguji di Mac saya jika saya mengubah userAgent ke iPhone atau Chrome Windows, navigator.platform tetap MacIntel.

navigator.platform tidak dipalsukan saat string userAgent diubah

Properti ini juga hanya-baca

navigator.platform hanya-baca


Saya bisa membuat tabel berikut

Komputer Mac

Mac68K Sistem Macintosh 68K.
MacPPC Sistem Macintosh PowerPC.
MacIntel Sistem Intel Macintosh.

Perangkat iOS

iPhone iPhone.
iPod iPod Touch.
iPad iPad.


Mac modern kembali navigator.platform == "MacIntel"tetapi untuk memberikan beberapa "bukti masa depan" jangan gunakan pencocokan persis, mudah-mudahan mereka akan berubah menjadi seperti MacARMatau MacQuantumdi masa mendatang.

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

Untuk menyertakan iOS yang juga menggunakan "sisi kiri"

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


Karena sebagian besar OS menggunakan tombol tutup di sebelah kanan, Anda dapat memindahkan tombol tutup ke kiri saat pengguna menggunakan MacLike OS, jika tidak, tidak masalah jika Anda meletakkannya di sisi yang paling umum, kanan.

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/

Vitim.us
sumber
3
@ Vitim.us terima kasih banyak atas jawaban mendetailnya, Anda benar-benar menyelamatkan hari saya :)
vivekkupadhyay
1
MacQuantum membuat hari saya menyenangkan. 😂
Íhor Mé
Properti platform hanya-baca, tetapi masih mungkin untuk memalsukannya: stackoverflow.com/questions/2166540/…
Ryan Burbidge
1
@Qix Perbaikan yang lebih baik akan diganti str.match(regexp) ? true : falsedengan regexp.test(string). The RegExp.prototype.test()Metode native mengembalikan boolean. Jadi, kode pilihan saya adalah const platformIsMacLike = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);.
Rory O'Kane
52

Sesederhana itu:

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

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

Anda bisa melakukan hal-hal lucu seperti:

var isMac = isMacintosh();
var isPC = !isMacintosh();
Benny Neugebauer
sumber
1
Nah, itu mencakup dua sistem operasi. Berikut adalah daftar yang lebih komprehensif (tetapi mungkin masih belum lengkap), yang mencakup Linux, BSD, Android, Palm, Sony Playstation, dll .: stackoverflow.com/questions/19877924/…
Michael Scheper
Jika Anda ingin mencakup lebih banyak sistem operasi, maka Anda harus menggunakan perpustakaan seperti Platform.js: github.com/bestiejs/platform.js
Benny Neugebauer
@BennyNeugebauer isPCseharusnya tidak sama dengan !isMacintosh();. Bagaimana jika pengguna menggunakan linux atau platform lain yang berbeda? Ini akan mendeteksi bahwa mereka tidak ada di mac dan berpikir bahwa mereka ada di PC.
Mistik
@ EternalDarkness Itulah mengapa saya menyebutnya isPC(dan bukan isWindowsatau isLinux) karena Linux berjalan di PC tetapi macOS hanya berjalan di Mac.
Benny Neugebauer
5

Apa ini yang kamu cari? Jika tidak, beri tahu saya dan saya akan menghapus postingan ini.

Coba plugin jQuery ini: http://archive.plugins.jquery.com/project/client-detect

Demo: http://www.stoimen.com/jquery.client.plugin/

Ini didasarkan pada quirksmode BrowserDetect a wrap untuk plugin deteksi jQuery browser / os.

Untuk pembaca yang tajam:
http://www.stoimen.com/blog/2009/07/16/jquery-browser-and-os-detection-plugin/
http://www.quirksmode.org/js/support.html

Dan lebih banyak kode di sekitar plugin berada di sini: http://www.stoimen.com/jquery.client.plugin/jquery.client.js

Tats_innit
sumber
2
DUDE! Saya memalsukan agen pengguna saya dan masih mendeteksi saya di Safari untuk Mac! Terima kasih BRUV.
alt
1
@JacksonGariety Jangan khawatir bruv :)) baca detail lebih lanjut di sini memiliki seluruh kode resinding :) stoimen.com/jquery.client.plugin/jquery.client.js Selamat bersenang -senang :) cheers!
Tats_innit
@Derek hiya bruv - menggunakan plugin browser quirkmode dan mendeteksi untuk browser / os lihat di sini quirksmode.org/js/detect.html dan selanjutnya lihat stoimen.com/jquery.client.plugin/jquery.client.js & quirksmode.org /js/support.html semoga masuk akal bruv :)
Tats_innit
Tidak apa-apa, ini tampaknya hanya menggunakan agen pengguna ... itu menyebalkan.
alt
1
Bukan jawaban yang saya cari. Apakah itu mungkin?
alt
0

Beri tahu saya jika ini berhasil. Cara untuk mendeteksi perangkat Apple (komputer Mac, iPhone, dll.) Dengan bantuan dari StackOverflow.com :
Apa daftar nilai yang mungkin untuk navigator.platform saat ini?

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
}
risingPhoenix1979
sumber