Perangkat antarmuka manusia di web: beberapa contoh singkat

Menghubungkan ke perangkat yang tidak umum dari aplikasi Anda.

Joe Medley
Joe Medley
Matt Reynolds
Matt Reynolds

Apa itu WebHID API?

Banyak perangkat antarmuka manusia (HID) yang terlalu baru, terlalu lama, atau terlalu jarang untuk diakses oleh driver perangkat sistem. WebHID API mengatasi hal ini dengan menyediakan cara untuk menerapkan logika khusus perangkat di JavaScript.

Kasus penggunaan yang disarankan untuk WebHID API

HID mengambil input dari atau memberikan output ke manusia. Contoh perangkat termasuk keyboard, perangkat penunjuk (mouse, layar sentuh, dll.), dan gamepad. Protokol HID memungkinkan perangkat mengakses perangkat ini di komputer desktop menggunakan driver sistem operasi. Platform web mendukung HID dengan mengandalkan driver ini.

Ketidakmampuan untuk mengakses perangkat HID yang tidak umum akan sangat menyakitkan jika terkait dengan dukungan gamepad. Gamepad yang dirancang untuk PC sering menggunakan HID untuk input gamepad (tombol, joystick, pemicu) dan output (LED, rumble). Namun, input dan output gamepad tidak terstandardisasi dengan baik dan browser web sering kali memerlukan logika kustom untuk perangkat tertentu. Hal ini tidak berkelanjutan dan menyebabkan kurangnya dukungan untuk longtail perangkat lama dan tidak umum. Hal ini juga menyebabkan browser bergantung pada quirks yang ada dalam perilaku perangkat tertentu.

Demo, demo, demo

Jika Anda ingin tahu cara kerja contoh ini, kode sumber untuk semuanya tersedia di GitHub. Ada contoh kode barebone dalam penjelasan.

Lampu latar keyboard MacBook Pro

Hambatan terbesar dalam mencoba salah satu demo ini adalah kurangnya akses ke perangkat. Untungnya, jika memiliki MacBook Pro dengan TouchBar, Anda tidak perlu membeli apa pun. Demo ini memungkinkan Anda menggunakan API langsung dari laptop. Bagian ini juga menunjukkan cara WebHID dapat digunakan untuk membuka fungsi perangkat bawaan, bukan hanya periferal.

Penulis: FWeinb
Demo/Sumber: Keyboard Backlight

Pengontrol game

Pengontrol nirkabel PlayStation 4

Selanjutnya adalah sesuatu yang mungkin hanya Anda miliki. DualShock 4 adalah pengontrol nirkabel untuk konsol game PlayStation 4.

Demo DualShock 4 menggunakan WebHID untuk menerima laporan input mentah dari DualShock 4 dan menyediakan API tingkat tinggi untuk mengakses giroskop, akselerometer, touchpad, tombol, dan input thumbstick pengontrol. Komponen ini juga mendukung gemuruh dan penyetelan warna LED RGB yang ada dalam pengontrol.

Penulis: TheBITLINK
Demo: Demo DualShock 4 (Sumber)

Pengontrol Nintendo Switch Joy-Con

Mainkan game offline Chrome dino 🦖 dengan melompat menggunakan pengontrol Nintendo Switch Joy-Con di saku celana. Demo ini didukung oleh Joy-Con WebHID, driver WebHID untuk pengontrol Nintendo Switch Joy-Con.

Penulis: Thomas Steiner
Demo: Chrome Dino WebHID (sumber demo, sumber pengemudi)

BlinkStick Strip

BlinkStick Strip adalah strip lampu yang mematuhi HID dengan LED 8 RGB. Demo ini memungkinkan pengguna memilih dari beberapa pola kedipan, termasuk chase, blink, dan pemindai Larson (alias Cylon).

Penulis: Robat Williams
Demo: blinkstick-strip (sumber)

Apa fungsi demo ini? (Tunggu.) Berkedip. Sebenarnya ada tiga demo yang menggunakan lampu notifikasi USB kedipan(1).

blink(1) sederhana dan terdokumentasi dengan baik, sehingga menjadikannya opsi yang bagus untuk memulai HID.

Penulis: Tod E. Kurt
Demo: blink(1) (sumber)

Ucapan terima kasih

Terima kasih kepada Pete LePage dan Kayce Basques atas ulasan artikel ini.

Foto oleh Ugur Akdemir di Unsplash