How to install JavaScript Media Recorder

The MeadiaRecorder is an interface that uses MediaStream Recording API to record media. This interface is activated when the QBMediaRecorder() constructor is called.

widget

Installation

Node package manager

We can install MediaRecorder using npm install:

npm install media-recorder-js --save

CDN

We can use CDN to install MediaRecorder:

<script src='https://unpkg.com/media-recorder-js/mediaRecorder.js'></script>

We can also download it directly from Github:

You need to have a gulp.js for this method.

npm i

npm run build

Initial set-up

You have to create a QBMediaRecorder() object with some predefined functions:

var config = {
    // use named function
    onstart: function onStart() {
        console.log('Starting Recorder');
    },
    onstop: function onStop(Blob) {
        videoElement.src = URL.createObjectURL(blob);
    },
    // '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(config);
New on Educative
Learn to Code
Learn any Language as a beginner
Develop a human edge in an AI powered world and learn to code with AI from our beginner friendly catalog
🏆 Leaderboard
Daily Coding Challenge
Solve a new coding challenge every day and climb the leaderboard

Free Resources

License: Creative Commons-Attribution-ShareAlike 4.0 (CC-BY-SA 4.0)