上一章节记录了如何进行视频通话, 这一章节就来记录一下视频通话时如何开启与关闭摄像头与麦克风,以及如何实现屏幕共享
麦克风的开启与关闭
我们可以通过设置本地视频流的 getAudioTracks()[0].enabled 的true或false来开关麦克风,为true时为开启,为false时为关闭
// localStream为本地视频流
localStream.getAudioTracks()[0].enabled = true
摄像头的开启与关闭
我们可以通过设置本地视频流的 getVideoTracks()[0].enabled 的true或false来开关摄像头,为true时为开启,为false时为关闭
// localStream为本地视频流
localStream.getVideoTracks()[0].enabled = true
屏幕共享
let screenSharingStream;
if(
//开启屏幕共享的条件
){
try {
// 获取共享视频流
screenSharingStream = await navigator.mediaDevices.getDisplayMedia({video: true})
// 从RTCpeerConnection中获取所有的senders(发送器)
const senders = peerConnection.getSenders()
// 遍历每个sender,找到类型为video的sender
const sender = senders.find(sender=> sender.track.kind===screenSharingStream.getVideoTracks()[0].kind )
// 替换远端视频
sender.replaceTrack(screenSharingStream.getVideoTracks()[0])
} catch (error) {
console.log("尝试获取屏幕共享流时出错", error);
}
}else{
const localStream = store.getState().localStream
// 从RTCpeerConnection中获取所有的senders(发送器)
const senders = peerConnection.getSenders()
// 遍历每个sender,找到类型为video的sender
const sender = senders.find(sender=> sender.track.kind===localStream.getVideoTracks()[0].kind )
// 替换远端视频
sender.replaceTrack(localStream.getVideoTracks()[0])
// 停止并清空轨道
screenSharingStream.getTracks().forEach(track => track.stop());
}