Media & Capture

MediaRecorder

Probing…

MediaRecorder is a web platform capability in the Media & Capture category. Record audio/video streams to files. Supported in Chromium 47+, Firefox 25+, and Safari 14.1+. Requires a secure context (HTTPS or localhost).

Secure context

Try it

Loading demo…

Code

const stream = await navigator.mediaDevices.getUserMedia({ video: true, audio: true })
const recorder = new MediaRecorder(stream)
const chunks = []

recorder.ondataavailable = e => e.data.size && chunks.push(e.data)
recorder.onstop = () => {
  const blob = new Blob(chunks, { type: 'video/webm' })
  videoEl.src = URL.createObjectURL(blob)
}

recorder.start()
// later: recorder.stop()

Browser support

Chromium
47
Firefox
25
Safari
14.1

Frequently asked questions

Which browsers support MediaRecorder?

Supported in Chromium 47+, Firefox 25+, and Safari 14.1+.

Does MediaRecorder require HTTPS?

Yes. MediaRecorder needs a secure context, so it only works over HTTPS (or on localhost during development).

What is MediaRecorder used for?

Record audio/video streams to files.

Can I try MediaRecorder in my browser?

Yes. shwcs.net runs a live MediaRecorder demo that probes your current browser and lets you try the API. Everything runs locally — nothing is sent anywhere.

MDN reference ↗ Specification ↗