HID-Serial Bridge

UIAPduino WebHID ↔ Web Serial（com0com 仮想 COM ペア）ブリッジ / Chrome / Edge 専用

⚠️ このページは Chrome または Edge でのみ動作します。
WebHID / Web Serial API は HTTPS または localhost が必要です。

📚 セットアップガイド — はじめて使う方へ

com0com をダウンロード・インストールする

com0com は Windows 用の仮想 COM ポートペアドライバです。
一方のポートに書き込んだデータがもう一方から読み出せる「ヌルモデム」をソフトウェアで実現します。

SourceForge のプロジェクトページからインストーラをダウンロードしてください。
「com0com - Signed」（署名済み版）を選ぶと、Windows のテスト署名モードを有効にする必要がなく、そのままインストールできます。

⚠️ インストールには 管理者権限 が必要です。インストーラを右クリック →「管理者として実行」で実行してください。

仮想 COM ペアを設定する（Setup GUI）

スタートメニュー → com0com → Setup を起動します。
インストール直後は CNCA0 ↔ CNCB0 というペアが1つ作られています。

両ポートの 「use Ports class」 にチェックを入れます。
これにより Windows が自動で COM 番号を割り当て、Arduino IDE シリアルモニタ／シリアルプロッタ・TeraTerm・Python・C# など一般アプリが「普通の COM ポート」として認識できるようになります。

【Setup GUI の操作手順】 1. 左側ポートの「use Ports class」にチェック ✔ 2. 右側ポートの「use Ports class」にチェック ✔ 3. 画面下の「Apply」ボタンをクリック 4. ツリーに「COMx」「COMy」と表示されれば完了

▲ Setup GUI の画面例。両側に「use Ports class」チェックが入り、ツリーに COM8・COM9 が表示されている状態

💡 割り当てられた COM 番号は Windows が自動で決めます。そのまま使うのが推奨です。
ツリー表示やデバイスマネージャー（devmgmt.msc）→「ポート (COM と LPT)」で確認できます。
このページの「Connect Serial」で選ぶのがブリッジ側（一方）、通信アプリで開くのがもう一方です。

⚠️ アプリが COM ポートを開いたままにしていると、次の接続時にデータが残留することがあります。
アプリを終了してから接続し直してください。

UIAPduino にスケッチを書き込む

このページ下部の 「スケッチソース」 からスケッチをダウンロードし、Arduino IDE で UIAPduino に書き込みます。
HID受信モード に合わせてスケッチを選んでください。

【Protocol モード（推奨・デフォルト）】 → HidMonitorTest ボード : HID ProMicro CH32V003 Tools → USB : WebHID Only 動作 : WaitAvailable() でブラウザ接続待ち → タイトル表示 → カウンタ送信用途 : Arduino IDE シリアルモニタで UIAPduino の出力を確認する

【Raw Binary モード】 → HidBridgeTest ボード : HID ProMicro CH32V003 Tools → USB : Keyboard+Mouse+WebHID 動作 : 受信バイトをそのまま Raw エコーバック用途 : HID 通信の疎通確認・低レベルデバッグ

💡 書き込み後、UIAPduino を USB から一度抜き差しすると確実に再接続されます。
スケッチソースは「HID受信モード」ボタンで切り替えると、対応スケッチに自動で切り替わります。

このページでブリッジを開始する

Chrome または Edge で開いたこのページで、次の順に操作します。

① Connect HID
UIAPduino を選択

→

② Connect Serial
COM8 を選択

→

③ Bridge 自動開始
Running ⚫

💡 HID と Serial の両方が接続されると、ブリッジは自動でスタートします。
Monitor は通常 OFF のままで問題ありません。確認したいときだけ ON にしてください。

COMモニタアプリから COM9 に接続する

TeraTerm・Arduino IDE シリアルモニタ・Python・C# など、シリアル通信ができるアプリで COM9（ペアの反対側）を開きます。

ボーレート : 115200（または任意）データビット: 8 / パリティ: なし / ストップビット: 1 / フロー制御: なし

◆ Protocol モード（HidMonitorTest スケッチ）の場合

UIAPduino が起動し、ブラウザが HID 接続すると自動的にタイトルヘッダとカウンタが送られてきます。
COMモニタ側（COM9）には、UIAPduino が hid.Println() で送った文字列がそのまま表示されます。
Arduino IDE のシリアルモニタを使えば、UIAPduino のデバッグ出力を確認できます。

UIAPduino
hid.Println()

→

HID通信
0x50 Input Report

→

WebCom通信
COM8 TX

→

COMモニタ
COM9 受信

◆ Raw Binary モード（HidBridgeTest スケッチ）の場合

COMモニタアプリから COM9 にデータを送信すると、UIAPduino を経由してそのままエコーバックされます。
HID 通信の疎通確認や低レベルデバッグに使います。

COMモニタ
COM9 送信

→

WebCom通信
COM8 RX

→

HID通信
Feature Report

→

UIAPduino
Raw エコーバック

→

HID通信
Input Report

→

WebCom通信
COM8 TX

→

COMモニタ
COM9 受信

⚠️ Raw Binary モードでは HID の 0x00 パディングもそのまま WebCom通信に流れます。テキスト表示を期待する場合は Protocol モードを使ってください。

▶ Status

WebHID —

Web Serial —

HID Disconnected

Serial Disconnected

Bridge Stopped

Mode Protocol (0x50/0x52)

🔌 HID Device

—

📌 Serial Port

baudRate: 115200 / 8N1 / flowControl: none

com0com でペアを作成し、ブリッジ側（例: COM8）をここで選択。外部アプリは反対側（例: COM9）を開いてください。

⚙ Bridge Control

HID → WebCom WebCom → HID Monitor ON

HID受信モード: — UIAPduino からの HID通信受信にのみ適用

HID通信 → WebCom通信: HID受信モードで選択。Raw Binary は全バイト転送（HidBridgeTest 向け）。Protocol は 0x50/0x52 をデコードして転送（hid.Print / hid.Write 系スケッチ向け）。
WebCom通信 → HID通信: 常に Raw。受信バイトを 32 バイト Feature Report に詰めて送信（30ms タイムアウト付き）。
Monitor OFF にするとデータ表示を止め、ブリッジ処理に専念します。SYSTEM / ERROR ログは常時表示。

📜 Data Monitor

■ HID RX ■ HID TX ■ SERIAL RX ■ SERIAL TX ■ SYSTEM ■ ERROR

⌨ Manual Send

Send to HID (Feature Report ID=0, 32 bytes)

32 bytes 未満はゼロパディング。32 bytes 超過はエラー。

Send to WebCom

入力バイト列をそのまま WebCom通信へ送信。

💾 スケッチソース — HidMonitorTest

GitHub ↗

書き込み手順: HidBridgeTest.ino / Hid.h / Hid.cpp を同じフォルダに置いて Arduino IDE で書き込む / ボード: HID ProMicro CH32V003, Tools → USB: Keyboard+Mouse+WebHID
起動時に hid.Ready()（0x53）で準備完了を通知。受信した Feature Report を hid.Send() で Raw エコーバック。
ブリッジを Raw Binary モードで使用してください。COMモニタ（TeraTerm 等）から送ったデータがそのまま返ってきます。

▶ プロトコル仕様

1. 通信インターフェイス定義

用語	区間	技術
`HID通信`	UIAPduino ↔ ブラウザ	USB HID（WebHID API）
`WebCom通信`	ブラウザ ↔ 仮想COMポート	Web Serial API
`VirtualCOM通信`	仮想COMペア内部（COM8 ↔ COM9）	com0com
`COMモニタ通信`	仮想COMポート ↔ モニタアプリ	シリアル通信

2. HID通信パケット定義

方向	種別	サイズ
UIAPduino → ブラウザ	Input Report	8 bytes
ブラウザ → UIAPduino	Feature Report	最大 32 bytes

マーカーバイト一覧

マーカー	名称	方向
`0x50`	Print	UIAPduino → ブラウザ
`0x51`	GetPos	双方向
`0x52`	Write	UIAPduino → ブラウザ
`0x53`	Ready	UIAPduino → ブラウザ
`0x01`	接続通知	ブラウザ → UIAPduino

3. プロトコル仕様

Print（0x50）

byte[0] = 0x50
byte[1] = flags  0x80=MORE（続きあり）  0x04=CLEAR（画面クリア）
byte[2..7] = テキスト（最大 6 文字、0x00 埋め）
※ 改行は 0x0A をテキストに含めて送信
※ 6 文字超は複数パケットに分割し MORE フラグで継続を示す

GetPos（0x51）

【リクエスト】UIAPduino → ブラウザ
byte[0]=0x51  byte[1]=0x01  byte[2..7]=0x00

【レスポンス】ブラウザ → UIAPduino（Feature Report）
byte[0]=0x51  byte[1]=0x01
byte[2..3]=X座標（Little Endian, int16_t）
byte[4..5]=Y座標（Little Endian, int16_t）

Write（0x52）

byte[0] = 0x52
byte[1] = flags  0x80=MORE（続きあり）
byte[2] = ペイロード長（0〜5）
byte[3..7] = バイナリペイロード

Ready（0x53）

byte[0] = 0x53
byte[1..7] = 0x00
※ 任意使用。ブラウザはログ表示のみ。WebCom通信には転送しない

接続通知（0x01）

byte[0] = 0x01
byte[1..] = 0x00
※ HID接続時にブラウザが送信。UIAPduino の WaitAvailable() が検出する

4. ブリッジ転送仕様

HID通信 → WebCom通信（モード選択）

パケット	Protocol モード（デフォルト）	Raw Binary モード
`0x50`	テキストを収集し WebCom通信へ転送	全バイトをそのまま転送
`0x52`	byte[2] のサイズ分を WebCom通信へ転送
`0x53`	ログのみ。転送しない
その他	無視

WebCom通信 → HID通信（常に Raw）

32 bytes 以上	即 Feature Report 送信
32 bytes 未満	30ms タイムアウト後ゼロパディングして送信

5. Hid クラス API

メソッド	プロトコル	説明
`Print(const char* s)`	`0x50`	テキスト送信（改行なし）
`Print(int v)`	`0x50`	整数送信（改行なし）
`Println(const char* s = "")`	`0x50`	テキスト送信 + 改行（0x0A）
`Println(int v)`	`0x50`	整数送信 + 改行（0x0A）
`Clear()`	`0x50` CLEAR	画面クリア
`Write(const uint8_t* buf, uint8_t len)`	`0x52`	バイナリ送信
`Send(const uint8_t* buf, uint8_t len)`	Raw	マーカーなし Raw 送信
`Ready()`	`0x53`	準備完了通知（任意）
`Recv(uint8_t* buf, uint8_t maxLen)`	—	Feature Report 受信。戻り値: 受信バイト数
`WaitAvailable(uint32_t timeoutMs = 0)`	—	Feature Report 到着まで待つ。データを消費しない。0 = 無限待ち
`GetPos(int16_t& x, int16_t& y)`	`0x51`	カーソル座標取得。500ms タイムアウト