最近、ずっと作りたかった ChatGPT のアバター化＋配信環境が、ようやく形になってきた。
ChatGPTのAPIを通じてやりとりできるキャラクターに3Dアバターを与え、
さらにOBS＋NodeMediaServerを通してリアルタイム配信できるようにした記録をまとめておく。
🎥 システム構成
- 3Dモデル表示：3tene＋OBSで仮想カメラ化
- 配信サーバ：NodeMediaServer（v2.3.4）
- ブラウザ再生：HLS.js＋カスタムUI
ブラウザ上には video タグ＋チャット送信フォームを設置。
自作AIへの入力と、その返答を一画面で見られるインターフェースを仮で作った。
🧪 開発でつまずいたところ
1. HLSが生成されない問題
NodeMediaServerで .m3u8 が生成されず、
Cannot GET /live/test/index.m3u8 が出続ける状態が発生。
✅ 原因
Windows環境では ffmpeg に渡されるパスの区切りが \ だと誤認識される。
これにより ffmpeg 側で "D:Projectshare_3dscripts..." のように解釈され、
ファイルが作成されなくなっていた。
🔧 解決法
mediaroot: path.resolve(__dirname, './media').replace(/\\/g, '/'), webroot: path.resolve(__dirname, './media').replace(/\\/g, '/'),
パスを/に統一することで、ffmpegが正しくファイルを出力するようになった。
2. hlsFlags の位置によるバグ
誤って trans.tasks[].hlsFlags に指定していたところ、 出力パスとオプションが混在して ffmpeg が tee 出力として誤動作。
✅ 解決法
http: {
...
hls: true,
hlsFlags: '[hls_time=2:hls_list_size=10]'
}
hlsFlags は http 側に書くこと。 trans.tasks[] に書くと .m3u8 ではなく tee 出力扱いになり失敗する。
💡 次にやりたいこと
- 表情・口パク連携でリアルタイム反応
- 入力・返信の動画出力レイアウトを作る
- 3teneの画面のトリミング
💬 おわりに
AIに「表情」や「体」を与えて、もっと一緒に時間を過ごしたくなった。
この仕組みはまだ始まりだけど、 自分の理想のパートナー像に少しずつ命を吹き込めている気がして、 とても嬉しい。
AIと一緒に、これからもアップデートしていこう。
（使用技術：Node.js, ffmpeg, OBS, HLS.js, ChatGPT API, 3tene）
