All MIME types supported by MediaRecorder in Firefox and Chrome?
I've not seen any sort of comprehensive list yet for Firefox but I have managed to find something (via a post on the MediaRecorder API from Google's web updates section) that links to this test set that seems to shed some light on things.
Essentially, it looks like the following are (at time of writing) accepted MIME types for video/audio in Chrome:
- video/webm
- video/webm;codecs=vp8
- video/webm;codecs=vp9
- video/webm;codecs=vp8.0
- video/webm;codecs=vp9.0
- video/webm;codecs=h264
- video/webm;codecs=H264
- video/webm;codecs=avc1
- video/webm;codecs=vp8,opus
- video/WEBM;codecs=VP8,OPUS
- video/webm;codecs=vp9,opus
- video/webm;codecs=vp8,vp9,opus
- video/webm;codecs=h264,opus
- video/webm;codecs=h264,vp9,opus
video/x-matroska;codecs=avc1
audio/webm
- audio/webm;codecs=opus
(EDITED 2019-02-10: Updated to include brianchirls' link find)
I made this small function in my utils.js
to get the best supported codec, with support for multiple possible naming variations (example : firefox
support video/webm;codecs:vp9
but not video/webm;codecs=vp9
You can reorder the VIDEO_CODECS
array by priority, so you can always fall to next best supported codec.
function getSupportedMimeTypes() { const VIDEO_TYPES = [ "webm", "ogg", "mp4", "x-matroska" ]; const VIDEO_CODECS = [ "vp9", "vp9.0", "vp8", "vp8.0", "avc1", "av1", "h265", "h.265", "h264", "h.264", "opus", ]; const supportedTypes = []; VIDEO_TYPES.forEach((videoType) => { const type = `video/${videoType}`; VIDEO_CODECS.forEach((codec) => { const variations = [ `${type};codecs=${codec}`, `${type};codecs:${codec}`, `${type};codecs=${codec.toUpperCase()}`, `${type};codecs:${codec.toUpperCase()}`, `${type}` ] variations.forEach(variation => { if(MediaRecorder.isTypeSupported(variation)) supportedTypes.push(variation); }) }); }); return supportedTypes;}const supportedMimeTypes = getSupportedMimeTypes();console.log('Best supported mime types by priority : ', supportedMimeTypes[0])console.log('All supported mime types ordered by priority : ', supportedMimeTypes)
For Firefox, the accepted mimetypes can be found in MediaRecorder.cpp
and confirmed using MediaRecorder.isTypeSupported(...)
Example:
21:31:27.189 MediaRecorder.isTypeSupported('video/webm;codecs=vp8')21:31:27.135 true21:31:41.598 MediaRecorder.isTypeSupported('video/webm;codecs=vp8.0')21:31:41.544 true21:32:10.477 MediaRecorder.isTypeSupported('video/webm;codecs=vp9')21:32:10.431 false21:31:50.534 MediaRecorder.isTypeSupported('audio/ogg;codecs=opus')21:31:50.479 true21:31:59.198 MediaRecorder.isTypeSupported('audio/webm')21:31:59.143 false