Thiết bị giao diện người dùng (HID) nhận dữ liệu đầu vào từ hoặc cung cấp đầu ra cho con người. Đây cũng là giao thức HID, một tiêu chuẩn cho hoạt động giao tiếp hai chiều giữa một máy chủ và một thiết bị được thiết kế để đơn giản hoá quy trình cài đặt.
Trang này mô tả các khía cạnh của API dành riêng cho các tiện ích. Hãy tham khảo MDN để biết toàn bộ thông tin chi tiết về API WebHID.
Bạn có thể tìm thấy ứng dụng mẫu cho WebHID trong kho lưu trữ mẫu của chúng tôi.
Khả năng sử dụng trong các tiện ích
Chrome 117 trở lên.
Quyền
Không yêu cầu quyền đối với tệp kê khai; tuy nhiên WebHID sẽ kích hoạt luồng quyền của người dùng của trình duyệt.
Tệp kê khai
Không cần khoá tệp kê khai cho API này.
Bối cảnh hỗ trợ
Bạn có thể sử dụng API này trong hầu hết mọi ngữ cảnh. Bạn không thể sử dụng phương thức WebHID.requestDevice() trong trình chạy dịch vụ tiện ích. Xem phần tiếp theo để biết chi tiết.
Khi API này được dùng trong một trình chạy dịch vụ tiện ích, phiên kết nối thiết bị sẽ duy trì hoạt động của trình chạy dịch vụ đó.
Sự khác biệt về tiện ích của Chrome
Mặc dù WebHID có sẵn cho trình thực thi dịch vụ tiện ích, nhưng WebHID.requestDevice() trả về một lời hứa sẽ giải quyết bằng thực thể HIDDevice, nhưng không thể gọi được trong trình chạy dịch vụ tiện ích. Để khắc phục vấn đề này, hãy gọi requestDevice() từ một trang tiện ích không phải trình chạy dịch vụ tiện ích rồi gửi tin nhắn cho trình chạy dịch vụ tiện ích đó.
Mã sau đây tuân theo một mẫu thông thường bằng cách gọi requestDevice() trong quy trình cấp quyền yêu cầu cử chỉ của người dùng. Sau khi được tiếp nhận, thiết bị sẽ gửi một thông báo cho trình chạy dịch vụ. Sau đó, trình chạy này có thể truy xuất thiết bị bằng cách sử dụng getDevices().
popup.js:
myButton.addEventListener("click", async () => {
await navigator.hid.requestDevice({
filters: [{ vendorId: 0x1234, productId: 0x5678 }],
});
chrome.runtime.sendMessage("newDevice");
});
service-worker.js
chrome.runtime.onMessage.addListener(async (message) => {
if (message === "newDevice") {
const devices = await navigator.hid.getDevices();
for (const device of devices) {
// open device connection.
await device.open();
}
}
});