How to switch from video/audio streaming to screen/audio streaming and back ?

[leonsal]

Hi,

During a call between two peers streaming video/audio, if one of them
wants to share his screen, he could use getDisplayMedia() to get
a new stream with screen/audio. How to send this new stream to
the peer instead of the current video/audio stream ?
Is it necessary to close the current peer connection and create a
new one with new stream ?

Regards.

[Florrr]

Its not necessary to create a new connection - you could just replace the tracks of the stream:

function replaceStream(peerConnection, mediaStream) {
        for(sender of peerConnection.getSenders()){
            if(sender.track.kind == "audio") {
                if(mediaStream.getAudioTracks().length > 0){
                    sender.replaceTrack(mediaStream.getAudioTracks()[0]);
                }
            }
            if(sender.track.kind == "video") {
                if(mediaStream.getVideoTracks().length > 0){
                    sender.replaceTrack(mediaStream.getVideoTracks()[0]);
                }
            }
        }
}

EDIT:
Also: Thats not a peerjs-related question. You could just search for "WebRTC change video stream in the middle of communication" for an appropriate answer

[leonsal]

It worked OK! Thanks!

[muhammadsaqib95]

It works fine but let me explain for the floks who are trying this with PeerJS.
function replaceStream() { navigator.mediaDevices.getDisplayMedia(device).then((stream) => { callSate.peerConnection.getSenders().forEach((sender) => { if(sender.track.kind === "audio" && stream.getAudioTracks().length > 0){ sender.replaceTrack(stream.getAudioTracks()[0]); } if (sender.track.kind === "video" && stream.getVideoTracks().length > 0) { sender.replaceTrack(stream.getVideoTracks()[0]); } }); videoRef.current.srcObject = stream; videoRef.current.play(); }); }

1. Here callSate is state/variable holds the value of call object which is returned when we make call or answer call of peer.
2. you can change getDisplayMedia to getUserMedia according to your need.
3. videoRef holds the reference to video displayed on frontend.

[Ritesh560]

can @muhammadsaqib95 or anyone tell me how we can handle the case when the call has only audio track previously and we need to add our screen recording video track to the call stream.

Regards