====脱Zoom宣言! WebRTC API でオリジナルのコミュニケーションツールを作ろう==== Zoomを皆さん使っていると思いますが、実は、これはWebRTC (Web RealTime Communication) APIを使ったアプリケーションにすぎません。WebRTCを使えば、自前のWeb会議システムは簡単(?) に実装可能です。Zoomは会議にはいいけど,人と人とのコミュニケーションにはいまいち...と思っている皆さん,オリジナルのオンラインコミュニケーションツールを開発しましょう!  WebRTC APIは、JavaScriptから簡単に利用することができます。つまり、基本的にはJavaScript だけで、実現できるということになります。 実現に向けて、ここに参考リンクを増やしていきます。 ==WebRTC関連リンク== * [[https://webrtc.org/|Web RTC . org]] 公式ページ * [[https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API|WebRTC API specification]] * [[https://www.slideshare.net/iwashi86/webrtcapi-112712583|WebRTCの日本語解説(slideshare)]] * [[https://html5experts.jp/series/webrtc2016/|WebRTC入門2016]] * [[https://gist.github.com/voluntas/67e5a26915751226fdcf|WebRTCコトハジメ]] * [[https://qiita.com/lighthouse/items/34bb8ccb6149bbfae427|WebRTCでビデオチャットアプリを作ってみた!]] ==WebRTCベースのOSS Web会議システム== * [[https://meet.jit.si/|JITSI]] WebRTCベースのオープンソースのビデオ会議システム[[https://github.com/jitsi/jitsi-meet|github]] サーバベースの多対多通信をサポートしていて,サーバのコードも含まれています. * [[http://webrtc.intel.com/|Intel Open WebRTC ToolKit]] SFU + MCUの両方入ってます.[[https://github.com/open-webrtc-toolkit/owt-server|github]] The usage scenarios for real-time media stream analytics including but not limited to movement/object detectionと書かれているので,サーバに画像処理追加可能です. * [[http://www.kurento.org/|Kurento]] an Open Source Software WebRTC media server. Seamlessly OpenCV integration と書かれているのでかなり期待できそう.[[https://doc-kurento.readthedocs.io/en/6.13.0/user/about.html|Document]]が充実しています.Media serverにmedia processing moduleを簡単に追加できるそうです.リアルタイム画像変換入れるにはこれが最適そう. * [[http://lynckia.com/licode/|Licode]] Server/Clientともに,APIが整備されている.Client APIのgetVideoFrame()をvideo streamをcanvasに取り込めて,Javascript上で画像処理できます.Server APIでは,streamは取り込めない. * [[https://webrtc.ecl.ntt.com/js-sdk.html|NTTコムのSkyWay SDK]] OSSではないですが,サーバインストールしないで済ますには,無償のNTTコムのSkyWayサーバを利用することを前提にSkyWayのSDKを使って見る手があります.[[https://qiita.com/advent-calendar/2018/skyway|活用事例集 (SkyWay 2018 Advent Calendar)]] 昔は,ブラウザからマイクやカメラにアクセスするにはFlashを利用することが必須でしたが,Flashは今年で終了が決まっています.それに代わるJavaScriptベースのAPIがWebRTCということになります.PCのブラウザ(Chrome, Firefox, Safari, Edge) はもちろん,iPhone/iPadのSafari, AndroidのChromeでも動作するのが特徴です. WebRTCの通信方法は,P2Pベースの1対1通信,サーバが仲介する多対多通信の2通りがあります.P2Pの場合は,最初に2つの通信先にIPアドレスなどを仲介するシグナリングサーバが必要です.また,P2P通信を3人以上の参加者すべての間で行うフルメッシュ型通信というのもあります.多対多の場合は,MCU (Multipoint Control Unit)かSFU (Selective Forwarding Unit) と呼ばれるサーバが必要になります.MCUはサーバで映像や音声の合成処理を行いますが,SFUでは単にクライアントから受け取った映像・音声のストリームを選択し,そのままクライアントに転送するだけです.Zoomなどでは喋っている人の音声と映像に自動的に切り替わりますが,SFUで配信対象ストリームが自動的に選択されているためだと推測できます.SFUは信号の加工を行わないため遅延が小さいですが,MCUでは加工を行うためサーバに負荷が発生し,遅延が発生しやすくなります.通常はSFUですが,遅延があまり問題にならないZoomの参加者16名までの合成映像などはMCUによって処理されているものと推測できます.各クライアントとサーバの間は通常のサーバクライアント通信です. オリジナルの通信ツールを作るには,OSSのmedia serverを利用するのが良さそうです.いずれもJavascriptのclient sample codeがあるので,改造は容易です.[[https://doc-kurento.readthedocs.io/en/6.13.0/|Kureto]]がドキュメントが充実しているので,良さそうです. こちらはクライアントでの処理の例です.こちらはサーバ処理よりも敷居が低いです. * [[https://qiita.com/taka_katsu411/items/9ca5baa04671c8aedde7|WebRTCで画像処理]] * [[https://webrtchacks.com/webrtc-cv-tensorflow/|WebRTC+TensorFlow ObjectDetection]] * [[https://qiita.com/hand10ryo/items/d7959d9ca8524a8369ab|WebRTC×Tensorflow.jsによるエッジAI感情認識ビデオチャット!]] SkyWayを利用. * [[https://qiita.com/yorifuji/items/9988f9a31c48bae31def|WebRTCで音声翻訳]] ==J専攻学生が作ったコロナ対応OSS== * [[https://github.com/nenoNaninu/NeuralVirtualCam|リアルタイムスタイル変換仮想カメラドライバNeuralVirtualCam]] ビデオチャットの映像をリアルタイムでスタイル変換します.標準的なConvResBlockDeconvNetによる変換なので,パラメータを入れ替えれば,様々な変換に対応できます.Ubuntu+GPU搭載マシン限定です.