やりたいこと
WebRTCでコネクションを作ったあとに、自分のビデオ、マイク音声on/offをシームレスに切り替えるようにしたい。
Skypeとかにあるビデオ、音声ミュート機能と同じやつ。 例えば、今ちょっと自分の画面を相手に見せたくないよ、でもコネクションは切りたくないよ、なんていうときに使われるであろう機能。
やり方
最初は、getUserMediaで新しいconstraintsをセットして、streamをreplaceしてやれば良いかな?と思ったけど、 getUserMediaの仕様上、constraintsのvideo, audioのいずれか一方は必須パラメータのため、両方OFFにするケースに対応できず諦めた。(それにちょっとこのやり方はよくない)
調べていると良い方法が見つかったので以下に記載する。
普通にgetUserMediaでローカルストリームを取得する
// get local stream navigator.mediaDevices .getUserMedia(constraints) .then(stream => { localStream = stream }) .catch(error => { // error handling })
ビデオ、音声は、取得したローカルストリームのgetVideo/AudioTracks()[0].enabled パラメータにtrue/falseをセットすることで動的にon/offを切り替えられる。 適当に以下のようなfunctionでそれぞれスイッチできた。
const updateVideoEnabled = (enabled) => { if (localStream) { localStream.getVideoTracks()[0].enabled = enabled } } const updateAudioEnabled = (enabled) => { if (localStream) { localStream.getAudioTracks()[0].enabled = enabled } }