อุปกรณ์ที่โต้ตอบกับมนุษย์โดยตรงบนเว็บ: ตัวอย่างบางส่วนสั้นๆ

การเชื่อมต่อกับอุปกรณ์ที่ไม่ค่อยพบจากแอป

Joe Medley
Joe Medley
Matt Reynolds
Matt Reynolds

WebHID API คืออะไร

อุปกรณ์ที่โต้ตอบกับคนโดยตรง (HID) จำนวนมากใหม่เกินไป เก่าเกินไป หรือไม่เป็นที่นิยมเกินไปจนไดรเวอร์อุปกรณ์ของระบบเข้าถึงไม่ได้ WebHID API ช่วยแก้ปัญหานี้ด้วยการให้วิธีใช้ตรรกะเฉพาะอุปกรณ์ใน JavaScript

กรณีการใช้งานที่แนะนำสำหรับ WebHID API

HID รับอินพุตจากหรือให้เอาต์พุตแก่ผู้ใช้ ตัวอย่างอุปกรณ์ ได้แก่ แป้นพิมพ์ อุปกรณ์ชี้ (เมาส์ หน้าจอสัมผัส ฯลฯ) และเกมแพด โปรโตคอล HID ช่วยให้เข้าถึงอุปกรณ์เหล่านี้ในคอมพิวเตอร์เดสก์ท็อปได้โดยใช้ไดรเวอร์ระบบปฏิบัติการ แพลตฟอร์มเว็บ รองรับ HID โดยอาศัยไดรเวอร์เหล่านี้

การเข้าถึงอุปกรณ์ HID ที่ไม่ค่อยพบได้ทั่วไปไม่ได้เป็นปัญหามากนักเมื่อพูดถึงการรองรับเกมแพด เกมแพดที่ออกแบบมาสำหรับ PC มักใช้ HID สำหรับอินพุต (ปุ่ม จอยสติ๊ก ทริกเกอร์) และเอาต์พุต (LED การสั่น) ของเกมแพด อย่างไรก็ตาม อินพุตและเอาต์พุตของเกมแพดไม่ได้มาตรฐานมากนัก และเว็บเบราว์เซอร์มัก ต้องใช้ตรรกะที่กำหนดเองสำหรับอุปกรณ์บางอย่าง ซึ่งเป็นวิธีที่ไม่ยั่งยืนและส่งผลให้การสนับสนุนอุปกรณ์รุ่นเก่าและอุปกรณ์ที่ไม่ค่อยพบเห็นเป็นไปได้ไม่ดี นอกจากนี้ยังทำให้ เบราว์เซอร์ต้องอาศัยข้อบกพร่องที่พบในลักษณะการทำงานของอุปกรณ์บางรุ่นด้วย

การสาธิต การสาธิต การสาธิต

หากคุณสงสัยว่าตัวอย่างเหล่านี้ทำงานอย่างไร ซอร์สโค้ดของตัวอย่างทั้งหมด จะพร้อมให้บริการบน GitHub ดูตัวอย่างโค้ดแบบพื้นฐานได้ใน คำอธิบาย

ไฟแบ็กไลต์ของแป้นพิมพ์ MacBook Pro

อุปสรรคที่ใหญ่ที่สุดในการลองใช้การสาธิตเหล่านี้คือการไม่มีสิทธิ์เข้าถึงอุปกรณ์ โชคดีที่หากคุณมี MacBook Pro ที่มีทัชบาร์ คุณก็ไม่จำเป็นต้องซื้ออะไร การสาธิตนี้ช่วยให้คุณใช้ API ได้จากแล็ปท็อปโดยตรง นอกจากนี้ ยัง แสดงวิธีใช้ WebHID เพื่อปลดล็อกฟังก์ชันการทำงานของอุปกรณ์ในตัว ไม่ใช่ แค่ของอุปกรณ์ต่อพ่วง

ผู้เขียน: FWeinb
การสาธิต/แหล่งที่มา: ไฟแบ็กไลต์ของแป้นพิมพ์

เกมคอนโทรลเลอร์

คอนโทรลเลอร์ไร้สาย PlayStation 4

ถัดไปเป็นสิ่งที่หลายๆ คนอาจไม่มี DualShock 4 ของ Sony เป็น คอนโทรลเลอร์ไร้สายสำหรับคอนโซลเกม PlayStation 4

การสาธิต DualShock 4 ใช้ WebHID เพื่อรับรายงานอินพุตดิบจาก DualShock 4 และมี API ระดับสูงสำหรับเข้าถึงไจโรสโคป ตัวตรวจวัดความเร่ง ทัชแพด ปุ่ม และอินพุตของก้านควบคุมของคอนโทรลเลอร์ นอกจากนี้ยังรองรับการสั่น และการตั้งค่าสีของไฟ LED แบบ RGB ที่อยู่ภายในคอนโทรลเลอร์ด้วย

ผู้เขียน: TheBITLINK
การสาธิต: การสาธิต DualShock 4 (แหล่งที่มา)

คอนโทรลเลอร์ Nintendo Switch Joy-Con

เล่นเกมไดโนเสาร์ Chrome 🦖 แบบออฟไลน์ด้วยการกระโดดจริงๆ โดยใช้คอนโทรลเลอร์ Joy-Con ของ Nintendo Switch ในกระเป๋ากางเกง การสาธิตนี้ขับเคลื่อนโดย Joy-Con WebHID ซึ่งเป็นไดรเวอร์ WebHID สำหรับ ตัวควบคุม Nintendo Switch Joy-Con

ผู้เขียน: Thomas Steiner
เดโม: WebHID ของไดโนเสาร์ Chrome (แหล่งที่มาของเดโม, แหล่งที่มาของไดรเวอร์)

แถบไฟ BlinkStick

BlinkStick Strip เป็นแถบไฟที่สอดคล้องกับ HID ซึ่งมีไฟ LED แบบ RGB 8 ดวง การสาธิตช่วยให้ ผู้ใช้เลือกรูปแบบการกะพริบได้หลายแบบ เช่น ไล่ กะพริบ และ สแกนเนอร์ Larson (หรือที่เรียกว่า Cylon)

ผู้เขียน: Robat Williams
การสาธิต: blinkstick-strip (แหล่งที่มา)

การสาธิตนี้ทำอะไรได้บ้าง (รอหน่อยนะ) ตัวละครกระพริบตา จริงๆ แล้วมี 3 การสาธิตที่ ใช้ไฟแจ้งเตือน USB blink(1)

blink(1) ใช้งานง่ายและมีเอกสารประกอบครบถ้วน จึงเป็นตัวเลือกที่ยอดเยี่ยมสำหรับ การเริ่มต้นใช้งาน HID

ผู้เขียน: Tod E. Kurt
การสาธิต: blink(1) (แหล่งที่มา)

คำขอบคุณ

ขอขอบคุณ Pete LePage และ Kayce Basques