How to add Video Track to Simple-Peer stream?

669 views Asked by At

I am trying to add a video track to the user's stream object so that the peers can see it. In componentDidMount() I initially get the permission to use the microphone, but I have a button that I would like to use to add a video track.

I have a mute/unmute button, that toggles the audio, that works just fine, but when I try to add a video track the same way I can't get it to arrive to the peers.

This is the code I use to get access to the microphone only:

getAudio(callback, err) {
    const options = { video: false, audio: true };
    if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
        return navigator.mediaDevices.getUserMedia(options)
            .then(stream => callback(stream))
            .catch(e => err(e));
    }
    return navigator.getUserMedia(options, callback,  err);
}

I call this in componentDidMount() like so:

this.getAudio(this.onAudio, err => {
    this.setState({
        mediaErr: 'Could not access webcam'
    });
    console.log('getMedia error', err);
});

The onAudio() creates the peers, since it runs on mount. I have a button I use to mute/unmute the audio like this:

toggleMicrophone(){
    const audioTrack = this.stream.getAudioTracks()[0];
    audioTrack.enabled = !audioTrack.enabled;
    this.setState({
        microphoneEnabled: audioTrack.enabled
    });
}

This works fine, so I tried to add the video track pretty much the same way. I have a button that calls the getVideo(), that is identical to the getAudio(), except in the options, audio and video are both set to true. getVideo() calls the onVideo(), passing it the stream it gets from getUserMedia().

The onAudio() function:

onVideo(stream){
    this.stream.addTrack(stream.getVideoTracks()[0]);
}

Since the mute button worked just by disabling the audio track, I thought I could just add the video track here and the peers would see the video stream, but it doesn't work that way.

The video track appears for the user that pressed the button, but not for the peers. What am I missing?

0

There are 0 answers