RP2040 SSM - Web HID 테스트

 

RP2040에서 WebSerial 테스트 했던것 처럼 HID 장치도 Web에서 제어 할수 있다고 한다.

RP2040 - Serial Web 테스트

WebHID 를 테스트 해보자

 

RP2040의 펌웨어 코드는 RP2040 Custom HID 제어 예제를 이용 하였다.

WebHID 웹페이지는  https://developer.mozilla.org/en-US/docs/Web/API/WebHID_API 를 참고 해서 작성 하였다.

 

 

HID 장치 오픈 하기 JAVA 코드

document.getElementById('start-button').addEventListener('click', handleConnectClick);

var hid_device;
async function handleConnectClick()
{
	hid_device = await openDevice();
}


async function openDevice() {
	const vendorId = 0x2E8A;
	const productId = 0x000a;

	const device_list = await navigator.hid.getDevices();
	console.log(device_list)
	
	let device = device_list.find(d => d.vendorId === vendorId && d.productId === productId);

	if (!device) {
		// this returns an array now
		let devices = await navigator.hid.requestDevice({
			filters: [{ vendorId, productId }],
		});
		console.log("devices:",devices);
		device = devices[0];
		if( !device ) return null;
	}

	if (!device.opened) {
		await device.open();
	}
	console.log("device opened:",device);
	return device;
}

 

 

WebHID에서 데이터 전송 코드

async function SendData1() {
	const Data = [1, 0, 1];
	hid_device.sendReport(0x00, new Uint8Array(Data));
}

async function SendData2() {
	const Data = [1, 1, 1];
	hid_device.sendReport(0x00, new Uint8Array(Data));
}	

document.querySelector("switch-component").addEventListener("change", function (e)
{
	const currentState = e.detail.state;
	console.log("from switch-component CHANGE EVENT :", currentState);

	if(currentState == 'ON')
	{
		SendData1();
	}
	else
	{
		SendData2();
	}
 });

 

 

RP2040에서 Web HID를 이용해서 Web 페이지상에서 HID 제어 테스트 결과