AngularJS + HTML5 Sound Recording File

Question

I am looking for a simple solution to record an audio file and upload it to s3.

My searches come to find:

WebRTC-Experiment , which is the most popular solution I could find.

it also has a working example in the following link: https://www.webrtc-experiment.com/RecordRTC/

I also found ngCamRecorder , which was not yet supported by firefox.

I am looking for a simple solution + working example and suggestion.

• Which solution is most popular for use with AngularJS?

• if you can provide your own example or a link to a working example that I can use.

• If you also used S3, I would like to know how you can click a file on S3 and get a link to the controller.

The solution I found throws an error and includes a working example without explaining the code. I would also like to know how to click on s3.

This is the code implemented in the example:

$scope.start_recording = function() { navigator.getUserMedia(session, function (mediaStream) { window.recordRTC = RecordRTC(MediaStream); recordRTC.startRecording(); }, function(error){console.log(error)}); }; $scope.stop_recording = function() { navigator.getUserMedia({audio: true}, function(mediaStream) { window.recordRTC = RecordRTC(MediaStream); recordRTC.startRecording(); }); }; 

It just throws an error: undefined is not a function on the line recordrtc.js 641

  if(!mediaStream.getAudioTracks().length) throw 'Your stream has no audio tracks.'; 

Obviously mediaStrem is null.

Thanks.

Answer 1

There is a wrapper for AngularJS for this, it is a simple directive that supports HTML5 (RecorderJS), Cordova Media and Flash.

Use is simple

 <ng-audio-recorder audio-model="someModel" auto-start="false"> <!-- controls --> <button ng-click='recorder.startRecording()'>Start</button> <button ng-click='recorder.stopRecording()'>Stop</button> </ng-audio-recorder> 

Here you can see the full usage:

https://github.com/logbon72/angular-recorder

Answer 2

I have the same problem and I figured it out. The argument of the function in the success.getUserMedia () function must be "MediaStream" instead of "mediaStream".