Awesome Open Source
Awesome Open Source

Logo of QBMediaRecorderJS


The QBMediaRecorder.js is a JavaScript library providing stream object (representing a flux of audio- or video-related data) recording and extending the MediaStream Recording API.

npm npm

QBMediaRecorder.js support all native mimetypes and 'audio/wav' and 'audio/mp3'. For support wav and mp3 add qbAudioRecorderWorker.js to your project and set custom mimeType and workerPath in QBMediaRecorder's options:

var opts = {
    // use named function
    onstart: function onStart() {
        console.log('Recorder is started');
    onstop: function onStop(Blob) {
        videoElement.src = URL.createObjectURL(blob);
    // 'audio/wav' or 'audio/mp3'
    mimeType: 'audio/mp3',
    // set relative path (from folder node_modules for example)
    workerPath: '../node_modules/javascript-media-recorder/qbAudioRecorderWorker.js'

// uses as global variable, QBMediaRecorder is built as a UMD module.
var recorder = new QBMediaRecorder(opts);

Extendings methods of MediaRecorder:

See docs - all public API. Check our sample, use a few source (video / audio).


The QBMediaRecorder supports Firefox 29, Chrome 49 / Chrome 62 for Android, Opera 36 and Safari 6.1 (only wav and mp3)


The QBMediaRecorder is built as a UMD module and can be loaded via CDN, NPM, or from source.


You can use CDN (by UNPKG) to deliver the QBMediaRecorder.

<script src=''></script>

Or use NPM

npm install media-recorder-js --save

Also you can download sources from Github, run project by the following commands. You will need to have Gulp.

npm i
npm run build


ESLint uses in project as lint, so install it before start developing.

npm install -g eslint

Related posts

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (70,927
video (889
audio (688
webrtc (369
mp3 (123
recorder (43
wav (42