The MediaRecorder.onstop event handler (part of the MediaRecorder API) handles the stop event, allowing you to run code in response to media recording via a MediaRecorder being stopped.

The stop event is thrown either as a result of the MediaRecorder.stop() method being invoked, or when the media stream being captured ends. In each case, the stop event is preceded by a dataavailable event, making the Blob captured up to that point available for you to use in your application.


MediaRecorder.onstop = function(event) { ... }
MediaRecorder.addEventListener('stop', function(event) { ... })



  mediaRecorder.onstop = function(e) {
    console.log("data available after MediaRecorder.stop() called.");

    var audio = document.createElement('audio');
    audio.controls = true;
    var blob = new Blob(chunks, { 'type' : 'audio/ogg; codecs=opus' });
    var audioURL = window.URL.createObjectURL(blob);
    audio.src = audioURL;
    console.log("recorder stopped");

  mediaRecorder.ondataavailable = function(e) {



Specification Status Comment
MediaStream Recording
The definition of 'MediaRecorder.onstop' in that specification.
Working Draft Initial definition

Browser compatibility

BCD tables only load in the browser

See also