VRChatがOSCに対応したので、まずはNode.jsでアバターをジャンプさせてみた

参考記事

• VRChat https://hello.vrchat.com/
• 【VRChat】オープンベータ版で「OSC」に対応 オーディオ機器でアバターの一部操作が可能に | Mogura VR https://www.moguravr.com/vrchat-29/
• VRChat OSC for Avatars — VRChat https://hello.vrchat.com/blog/vrchat-osc-for-avatars
• VRChat OSCを使ってMIDI機器でVRCHATを操作する - Qiita https://qiita.com/takahyon/items/ba6b011f31879c32a89f
• OSC Overview https://docs.vrchat.com/v2022.1.1/docs/osc-overview

OSCとは

• OpenSound Control - Wikipedia https://ja.wikipedia.org/wiki/OpenSound_Control
• UDPのSocket(ソケット)通信である(が一般的)
  • 一方通行
  • 常時接続
    • たくさんの数のメッセージのやりとりに向いている
    • 逆：ブラウザでWebページにアクセスする (HTTP通信)
• UDP通信でやりとりするメッセージのルール
  • メッセージのトピックは /(スラッシュ) 区切り
  • トピックの後ろに ,(カンマ) でメッセージ内容（スペースのときもある）
  • 見えないところでnullコードも入ってるっぽい
  • 例：/avatar/change,avatarId12345
  • 例：/avatar/add,aaaassss98765
• 必要な情報はIPとPort(ポート)番号
  • IPアドレス:ポート番号　例 127.0.0.1:9000

TramontanaやZigSimもスマートフォンでOSC

以前に使ったアプリもOSCで通信できます

VRChat公式ドキュメント内では

• TouchOSC | hexler.net https://hexler.net/touchosc
• Protokol | hexler.net https://hexler.net/protokol

つまり、OSCはいろんなところで使われていますよ

VRChatOSCのドキュメント

• OSC Overview https://docs.vrchat.com/v2022.1.1/docs/osc-overview

これを踏まえて読んでみる

--osc=9000:127.0.0.1:9001

メッセージは一方通行！
なので、VRChat側からは

• 9001番ポートへ送っていて
• 9000番ポートで待ち受けている

他のアプリからだと、

• 9000番ポートへ送って
• 9001番ポートで待ち受ける

127.0.0.1とlocalhostと0.0.0.0の違い - Qiita https://qiita.com/1ain2/items/194a9372798eaef6c5ab

手順

VRChat側

• SteamでVRChatをダウンロード
• SteamのVRChatの設定、プロパティから open-beta - Open Beta を選択
  • Windows限定っぽい
  • 02/27現在、ik-beta - IK-Beta に変わってますね
• VRChatをアップデート
• デスクトップモードで起動
• VRChat内でOSCを有効化
  • デバッグメニューを出しておくといいかも
  • そこを見るとポート番号は9000番だということがわかります

Node.jsで通信してみる

• npm init -y
• npm i node-osc

const osc = require('node-osc');

const client = new osc.Client('127.0.0.1', 9000);
let count = 0;

// 1秒間隔で0,1を交互に送る
// たぶん1がジャンプボタンを押して、0が離す動作っぽい
setInterval(() => {
  client.send('/input/Jump', count % 2);
  count++;
}, 1000);

const server = new osc.Server(9001, '0.0.0.0');
server.on('/avatar/change', (avatarId) => {
  console.log('アバターチェンジ！ '+avatarId);
});

コメントでも書いてある通り、/input/Jump へ送るだけだとなぜかジャンプしなくて…
値を1と0交互に送ってあげるとできました

ドキュメント内を読むと、1がボタンを押し込む動作で、0が離す動作っぽかったでした（ちょっと躓いた…）

アバターの変更イベントも来ました！

次回予定

M5StackCore2で通信してみる！

しかもUIFlowで！