Recording And Playing Back Audio On Ionic 3

I am having a weird issue on iOS. I am using the Ionic Native Media plugin to record audio and trying to play the recording back using the HTML5 Web Audio API (WavesurferJS or Howl

Solution 1:

https://github.com/ionic-team/ionic-native/blob/master/src/%40ionic-native/plugins/media/index.ts - mentions stuff in comments..

 * Some hints if you are using iOS and recording doesn't work:
 * 1.) Try to use a absolute file path but remove beginning "file://".
 * Then it looks like: `/var/mobile/Containers/Data/Application/AF438B8B-7724-4FBB-8E69-083463224FC4/tmp/my_file.m4a`
 * Example: `this.media.create(this.file.tempDirectory.replace(/^file:\/\//, '') + 'my_file.m4a')`
 * 2.) If that's not working, too, create the file before using.
 * Example:
 * ```typescript
 * import { Media, MediaObject } from '@ionic-native/media';
 * import { File } from '@ionic-native/file';
 *
 * ...
 *
 * constructor(private media: Media, private file: File) { }
 *
 * ...
 *
 * this.file.createFile(this.file.tempDirectory, 'my_file.m4a', true).then(() => {
 *   let file = this.media.create(this.file.tempDirectory.replace(/^file:\/\//, '') + 'my_file.m4a');
 *   file.startRecord();
 *   window.setTimeout(() => file.stopRecord(), 10000);
 * });
 * ```
 *
 * You can find the reasons here: https://github.com/ionic-team/ionic-native/issues/1452#issuecomment-299605906
 * @classes
 * MediaObject
 * @interfaces
 * MediaError
 */

Solution 2:

Use Cordova Plugin Media :

$ ionic cordova plugin add cordova-plugin-media
$ npm install --save @ionic-native/media

Useful article from ionic doc :

https://ionicframework.com/docs/native/media/