MediaRecorder: requestData() method
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2021.
The requestData()
method of the MediaRecorder interface is used to raise a dataavailable event containing a
Blob object of the captured media as it was when the method was
called. This can then be grabbed and manipulated as you wish.
When the requestData() method is invoked, the browser queues a task that
runs the following steps:
- If
MediaRecorder.stateis "inactive", raise a DOMInvalidStateerror and terminate these steps. IfMediaRecorder.stateis not "inactive", continue to the next step. - Raise a
dataavailableevent containing aBlobof the currently captured data (the Blob is available under the event'sdataattribute.) - Create a new Blob and place subsequently captured data into it.
Syntax
js
requestData()
Parameters
None.
Return value
None (undefined).
Exceptions
InvalidStateErrorDOMException-
Thrown if the
MediaRecorderis currently"inactive"; you cannot capture the recording if theMediaRecorderis not active.
Examples
js
captureMedia.onclick = () => {
mediaRecorder.requestData();
// makes snapshot available of data so far
// ondataavailable fires, then capturing continues
// in new Blob
};
Specifications
| Specification |
|---|
| MediaStream Recording> # dom-mediarecorder-requestdata> |
Browser compatibility
Loading…
See also
- Using the MediaStream Recording API
- Web Dictaphone: MediaRecorder + getUserMedia + Web Audio API visualization demo, by Chris Mills (source on GitHub.)
- simpl.info MediaStream Recording demo, by Sam Dutton.
Navigator.getUserMedia()