Video and audio stream control duirng the webrtc call

Question

I can make the webrtc call between 2 parties with video and audio stream together. Is there any way to give user to stop sharing only video or audio during the call?

Assume

A and B are in a webrtc call

during the Call A just stop his video channel so b can only listen the A's voice/audio not video. When A resume video again B can see A face again.

Can anyone help?

Answer 1

I have already solved it in a efficient way. I have hanlded the local stream audio and video to pasue and resume. See my below way

To pause a local video steam to connected partner: mediastream.getVideoTracks()[0].enabled = false;

To resume a local video steam to connected partner: mediastream.getVideoTracks()[0].enabled = true;

for audio: pasue: mediastream.getAudioTracks()[0].enabled = false;

resume: mediastream.getAudioTracks()[0].enabled = true;

It is working perfectly in my project.

Answer 2

The Suman's answer kind of solves the problem but it's not efficient. You're still transmitting the data, just not displaying it. It's a pure waste, which may be problematic in case of devices with limited bandwidth. Please note that by default WebRTC will go as high as 2Mbps for video.

The proper solution to this problem would be to renegotiate offer/answer between the peers and mark particular media as sendonly/recvonly.

To do so, you need to store somewhere the SDP offer and when there is a need to stop sending media of particular type, you need to replace line

a=sendrecv with a=recvonly

like:

var localDescr = peerConnection.localDescription;
localDescr = makeRecvOnly(localDescr);
peerConnection.setLocalDescription(localDescr,function(){});
someWebSocketTransport.sendUpdateStreamingStatus(localDescr)

then the other end should handle this sendUpdateStreamingStatus and set the received description using

peerConnection.setRemoteDescription(receivedRemoteDescr, function() {})

Hope this helps.

Answer 3

Suppose when user(A) click on stop button for hide video. You will apply the css video {display:none } to video( local/remote ) element, and send that command to server for other user(B), when other user get this command, on his side video( local/remote ) would be hidden with video{display:none} .

As a result the video would be hidden, and you(A) and other(B) can hear each other voice, when you click on show button just do the video{display : block} to video element on your and other's browser respectively.

But in this case if any user does video{display:block} through the inspect element from browser then video would appear on his side.