Các thiết bị có giao diện dành cho người dùng trên web: một số ví dụ ngắn gọn

Kết nối với các thiết bị không phổ biến từ ứng dụng của bạn.

Joe Medley
Joe Medley
Matt Reynolds
Matt Reynolds

API WebHID là gì?

Nhiều thiết bị có giao diện dành cho người dùng (HID) quá mới, quá cũ hoặc quá không phổ biến để trình điều khiển thiết bị của hệ thống có thể truy cập. API WebHID giải quyết vấn đề này bằng cách cung cấp một cách để triển khai logic dành riêng cho thiết bị trong JavaScript.

Các trường hợp sử dụng được đề xuất cho API WebHID

HID nhận dữ liệu đầu vào từ người dùng hoặc cung cấp dữ liệu đầu ra cho người dùng. Ví dụ về các thiết bị bao gồm bàn phím, thiết bị trỏ (chuột, màn hình cảm ứng, v.v.) và tay cầm chơi game. Giao thức HID giúp bạn có thể truy cập vào các thiết bị này trên máy tính để bàn bằng trình điều khiển hệ điều hành. Nền tảng web hỗ trợ HID bằng cách dựa vào các trình điều khiển này.

Việc không thể truy cập vào các thiết bị HID không phổ biến đặc biệt gây khó khăn khi nói đến việc hỗ trợ tay cầm chơi game. Tay cầm chơi game được thiết kế cho PC thường sử dụng HID cho dữ liệu đầu vào (nút, cần điều khiển, nút kích hoạt) và dữ liệu đầu ra (đèn LED, chế độ rung) của tay cầm chơi game. Tuy nhiên, dữ liệu đầu vào và đầu ra của tay cầm chơi game không được chuẩn hoá tốt và trình duyệt web thường yêu cầu logic tuỳ chỉnh cho các thiết bị cụ thể. Điều này không bền vững và dẫn đến việc hỗ trợ kém cho các thiết bị cũ và không phổ biến. Điều này cũng khiến trình duyệt phải phụ thuộc vào các điểm bất thường có trong hành vi của các thiết bị cụ thể.

Bản minh hoạ, bản minh hoạ, bản minh hoạ

Nếu bạn tò mò về cách hoạt động của bất kỳ mẫu nào trong số này, thì mã nguồn cho tất cả các mẫu đều có trên GitHub. Có một ví dụ về mã cơ bản trong phần giải thích.

Đèn nền bàn phím MacBook Pro

Rào cản lớn nhất khi dùng thử bất kỳ bản minh hoạ nào trong số này là thiếu quyền truy cập vào thiết bị. May mắn là nếu có MacBook Pro có TouchBar, bạn không cần phải mua gì cả. Bản minh hoạ này cho phép bạn sử dụng API ngay từ máy tính xách tay. Bản minh hoạ này cũng cho thấy cách sử dụng WebHID để mở khoá chức năng của các thiết bị tích hợp, không chỉ các thiết bị ngoại vi.

Tác giả: FWeinb
Bản minh hoạ/Nguồn: Đèn nền bàn phím

Tay điều khiển trò chơi

Tay điều khiển không dây PlayStation 4

Tiếp theo là một thứ mà ít người trong số các bạn có khả năng sở hữu. DualShock 4 của Sony là một tay điều khiển không dây dành cho máy chơi game PlayStation 4.

Bản minh hoạ DualShock 4 sử dụng WebHID để nhận các báo cáo đầu vào thô từ DualShock 4 và cung cấp một API cấp cao để truy cập vào con quay hồi chuyển, gia tốc kế, bàn di chuột, nút và dữ liệu đầu vào của cần điều khiển. Bản minh hoạ này cũng hỗ trợ chế độ rung và đặt màu cho đèn LED RGB nằm trong tay điều khiển.

Tác giả: TheBITLINK
Bản minh hoạ: Bản minh hoạ DualShock 4 (Nguồn)

Tay điều khiển Nintendo Switch Joy-Con

Chơi trò chơi khủng long 🦖 ngoại tuyến trên Chrome bằng cách thực sự nhảy với tay điều khiển Nintendo Switch Joy-Con trong túi quần. Bản minh hoạ này được hỗ trợ bởi Joy-Con WebHID, một trình điều khiển WebHID cho tay điều khiển Nintendo Switch Joy-Con.

Tác giả: Thomas Steiner
Bản minh hoạ: Trò chơi khủng long trên Chrome WebHID (nguồn bản minh hoạ, nguồn trình điều khiển)

Dải đèn BlinkStick

Dải đèn BlinkStick là một dải đèn tuân thủ HID với 8 đèn LED RGB. Bản minh hoạ cho phép người dùng chọn trong số một số kiểu nhấp nháy, bao gồm kiểu đuổi, nhấp nháy và kiểu quét Larson (còn gọi là Cylon).

Tác giả: Robat Williams
Bản minh hoạ: blinkstick-strip (nguồn)

Bản minh hoạ này làm gì? (Hãy chờ xem.) Bản minh hoạ này nhấp nháy. Thực ra, đây là 3 bản minh hoạ sử dụng đèn thông báo USB blink(1).

blink(1) rất đơn giản và được ghi lại đầy đủ, giúp bạn dễ dàng bắt đầu sử dụng HID.

Tác giả: Tod E. Kurt
Bản minh hoạ: blink(1) (nguồn)

Lời cảm ơn

Cảm ơn Pete LePageKayce Basques.