Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Ionicmic400
  • Overview
  • Transcript

1.2 Use the Microphone With Ionic

In this lesson we’ll build a small Ionic app to demonstrate how to use the Cordova plugin to access device hardware. We’ll set up a basic Ionic project, install the plugins, and then write some simple UI and controller code to record and play back audio from the microphone.

Code Snippet

Here’s the code we use to access the microphone directly, without having to open a separate recording app.

//our player was previously declared as an  HTTP element
var player = document.querySelector('audio');

function successCallback(stream) {
  //on success, the audio player is directed to play the sound as it records
  player.src = URL.createObjectURL(stream);       
};

function errorCallback(error) {
  //on failure, log the error
  console.log('navigator.getUserMedia error: ', error);

};

$scope.getUserAudio = function() {
  //because this API is still evolving, different browsers expose its with different names
  navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

  //finally, request the audio stream
  navigator.getUserMedia({audio:true, video:false}, successCallback, errorCallback);        
};

Related Links

1.Use the Microphone With Ionic
2 lessons, 13:38

Free Lesson
1.1
Introduction
00:51

1.2
Use the Microphone With Ionic
12:47