Skip to content

Latest commit

 

History

History
 
 

RecordRTC

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 

RecordRTC: WebRTC audio/video recording / Demo

RecordRTC allows you record audio and/or video streams.

Features

  1. Writes recorded file on disk and returns file URL
  2. It is your choice to get URL blob or file URL
How to use RecordRTC?
<script src="https://webrtc-experiment.appspot.com/RecordRTC.js"></script>

How to record video?

var recorder = RecordRTC({
	video: HTMLVideoElement
});

/* start recording video */
recorder.recordVideo();

/* stop recording video and save recorded file to disk */
recorder.stopVideo(function(recordedFileURL) {
   window.open(recordedFileURL);
});
How to record audio?
var recorder = RecordRTC({
	stream: MediaStream || LocalMediaStream
});

/* start recording audio */
recorder.recordAudio();

/* stop recording audio and save recorded file to disk */
recorder.stopAudio(function(recordedFileURL) {
   window.open(recordedFileURL);
});

Additional Features

/* getting URL Blob */
window.open( recorder.getBlob() );

/* getting recorded file URL */
window.open( recorder.toURL() );

/* save recorded Blob to disk */
recorder.save();

It is recommended to use stopAudio and stopVideo callback parameter to get recorded file URL or recorded Blob.

recorder.stopVideo(function(recordedFileURL) {
   window.open(recordedFileURL);
});

recorder.stopAudio(function(recordedFileURL) {
   window.open(recordedFileURL);
});

This method is reliable and works all the time without any failure.

Make sure that:

  1. You're using Chrome Canary, beta or dev
  2. You enabled flag Web Audio Input via chrome://flags

Possible issues/failures:

Do you know "RecordRTC" fails recording audio because following conditions fails:

  1. Sample rate and channel configuration must be the same for input and output sides on Windows i.e. audio input/output devices mismatch
  2. Only the Default microphone device can be used for capturing.
  3. The requesting scheme is none of the following: http, https, chrome, extension's, or file (only works with --allow-file-access-from-files)
  4. The browser cannot create/initialize the metadata database for the API under the profile directory

If you see this error message: Uncaught Error: SecurityError: DOM Exception 18; it means that you're using HTTP; whilst your webpage is loading worker file (i.e. audio-recorder.js) from HTTPS. Both files's (i.e. RecordRTC.js and audio-recorder.js) scheme MUST be same!

Saving to disk failures:

  1. You're using chrome incognito mode
  2. RecordRTC created duplicate temporary file
  3. The requesting scheme is none of the following: http, https, chrome, extension's, or file (only works with --allow-file-access-from-files)
  4. The browser cannot create/initialize the metadata database for the API under the profile directory

Click Save to Disk button; new tab will open; right-click over video and choose Save video as... option from context menu.

Browser Support

RecordRTC Demo works fine on following web-browsers:

Browser Support
Google Chrome Stable / Canary / Beta / Dev
Internet Explorer / IE Chrome Frame

Credits

  1. Recorderjs for audio recording
  2. whammy for video recording

Spec & Reference

  1. Web Audio API

License

RecordRTC is released under MIT licence . Copyright (c) 2013 Muaz Khan.