WebRTCの多機種対応で困ったこと
WebRTCを使ったアプリケーションの開発の際、いろいろなプラットフォームに対応で起きたことをまとめておきます。言語はJavaScript (TypeScript)です。
私の実装方法がマズかったという可能性もありますが、参考にしていただければと思います。
音声全般
mutedの指定をしないとハウリングする
videoタグに muted の指定が必要です。
muteするとPCの音声をミュートというイメージだったのですが、ここでのmute指定は相手には自分の声が届くけれど、自分の声はミュートするという意味でした。
ちなみに相手の声のミュートをする場合は AudioTrack のミュートをします(トラックの enabled = false にする)
iOS Safari 全般
videoタグにplaysInlineが必要
これは調べたらいろいろな人がはまっていました。
iOSでは videoタグに playsInline を書かないと動画が再生されませんでした。
iOS11 Safari
addEventListenerが無い
これはWebRTCというわけではないですが、画面のコントロールをするときなどに使おうと思ったら存在しない関数のエラーになってしまったという話です。
mediadevices.addEventListener(‘devicechange’) ではなく、
mediadevices.ondevicechange を使うことにしました。
applyConstraintsをしないとフレームレートの設定が効かない
getUserMedia のパラメータで frameRate を書けるのですが、これだけでは実際に有効にならず。getUserMediaで取得した stream に対して、applyConstraints({ frameRate:10}); のように改めて設定すると有効になりました。
iOS12 Safari
iOS13 Safari
applyConstraintsでフレームレートの設定をするとビデオが映らない
iOS13.4以上では問題なかったのですが、applyConstraints でフレームレートの設定をするとビデオが黒い表示になって映らないバージョンがありました。iOS11のために設定していると iOS13の一部で不具合になってしまいます。