The stop
event is fired when MediaRecorder.stop()
is called, 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.
Use the event name in methods like addEventListener()
, or set an event handler property.
addEventListener("stop", (event) => {});
onstop = (event) => {};
mediaRecorder.onstop = (e) => {
console.log("data available after MediaRecorder.stop() called.");
const audio = document.createElement("audio");
audio.controls = true;
const blob = new Blob(chunks, { type: "audio/ogg; codecs=opus" });
const audioURL = window.URL.createObjectURL(blob);
audio.src = audioURL;
console.log("recorder stopped");
};
mediaRecorder.ondataavailable = (e) => {
chunks.push(e.data);
};