pause Navigator.getUserMedia

Question

How do I pause the camera and microphone stream within the method getUserMedia?

I have my code like this:

navigator.getUserMedia({ video: true, audio: true },
    function (MediaStream) {

        var video = document.querySelector('#videoRecord');
        video.src = window.URL.createObjectURL(MediaStream);
        stream = MediaStream;
        var mediaRecorder = new MediaRecorder(MediaStream);

// como pausar aqui o stream e depois iniciar novamente?

}, errorCallback);

If I use

MediaStream.getAudioTracks()[0].stop();
MediaStream.getVideoTracks()[0].stop();

camera light turns off, but I don’t know how to put the stream back on, since I do everything within the function getUserMedia, so I don’t know if it would make sense to use one more getUserMedia within what already exists.

Answer 1

Pause camera (Mediarecorder)

Try MediaRecorder.pause() and MediaRecorder.resume() to restore, you can also use . pause in the video (if you have a video player), follow a simple example:

Important detail: navigator.getUserMedia() has been discontinued, the ideal use is navigator.mediaDevices.getUserMedia()

<video id="player" controls autoplay></video>
<button id="play_pause">Play/Pause</button>

<script>  
var player = document.getElementById('player');
var playPause = document.getElementById('play_pause');

var stream, myMediaRecorder;

navigator.mediaDevices.getUserMedia({video: true}).then(function (streamHandle) {
    player.srcObject = streamHandle;
    stream = streamHandle;
    myMediaRecorder = new MediaRecorder(streamHandle);
    myMediaRecorder.start();
});

playPause.onclick = function () {
    if (player.paused) {
       player.play();
       myMediaRecorder.resume();
    } else {
       myMediaRecorder.pause();
       player.pause();
    }
};
</script>

Example jsfiddle

---

Stop release the camera (Mediarecorder )

To stop everything it is necessary to use:

• MediaRecorder.stop()
• MediaStreamTrack.stop()

Besides it is necessary to finish everything possible and to return it is necessary (at least better) to restart everything. Example:

<video id="player" controls autoplay></video>
<button id="play_pause">Play/Stop</button>

<script>  
var player = document.getElementById('player');
var playPause = document.getElementById('play_pause');

var myStream, myMediaRecorder;

function gravar() {
    navigator.mediaDevices.getUserMedia({video: true}).then(function (streamHandle) {
        player.srcObject = streamHandle;
        myStream = streamHandle;
        myMediaRecorder = new MediaRecorder(streamHandle);
        myMediaRecorder.start();
    });
}

gravar(); //Auto inicia

playPause.onclick = function () {
    if (player.paused) {
        gravar();
    } else {
        myMediaRecorder.stop();
        player.pause();
        player.srcObject = null;

        var tracks = myStream.getTracks();

        tracks.forEach(function (track) {
            track.stop();
        });
    }
};
</script>

Example jsfiddle