Record audio (Cordova/Ionic) using cordova-plugin-media and cordova-plugin-file

record-audio.ts

import { Media, MediaObject } from '@ionic-native/media';
import { File as NativeFile, FileEntry } from '@ionic-native/file';

import { delay, getBlobFromFileEntry } from './utils'

// Detect platform device and select extension (Cordova platform, etc)
// Android
const AUDIO_EXTENSION = '.mp3'
// iOS
const AUDIO_EXTENSION = '.m4a'

export class PageDemo {
  private audioFile: FileEntry
  private audioMedia: MediaObject
  // private audioMediaSrc: string

  async onStartRecording() {
    const path = NativeFile.dataDirectory;
    const name = `record_${(new Date()).getTime() + AUDIO_EXTENSION}`;
    this.audioFile = await NativeFile.createFile(path, name, true);
    // Deprecated versions
    // this.audioMediaSrc = this.audioFile.nativeURL.replace(/^file:[\/]+/, '');
    // this.audioMedia = Media.create(this.audioMediaSrc);
    this.audioMedia = Media.create(this.audioFile.nativeURL);
    this.audioMedia.startRecord();
  }
  
  async onStopRecording() {
    if (this.audioFile) {
      try {
        this.audioMedia.stopRecord();
        // It requires a little delay to get media file data
        await delay(200);
        const blob = await getBlobFromFileEntry(this.audioFile);
        // SAVE AUDIO HERE!
        // uploadFile(this.audioFile.name, blob)
      } finally {
        this.audioFile = null;
      }
    }
  }
}

utils.ts

import { FileEntry } from '@ionic-native/file';

export const getBlobFromFileEntry = (fileEntry: FileEntry): Promise<Blob> => {
  return new Promise((resolve, reject) => {
    fileEntry.file((file) => {
      const reader = new FileReader();
      reader.onloadend = function(e) {
        try {
          const { result: buffer } = e.target
          const blob = new Blob(
            [new Uint8Array(buffer as any)],
            { type: file.type }
          );
          resolve(blob);
        } catch (error) {
          reject(error);
        }
      };
      reader.onabort = (ev) => reject(ev);
      reader.onerror = (ev) => reject(ev);
      reader.readAsArrayBuffer(file);
    }, reject)
  })
}

export const delay = (time: number) =>
  new Promise(resolve => setTimeout(() => resolve(), time))

I am not using any specific format, it seems like it is the default. This is my entire code, I didn't manually request permissions, but the dialog for recording and file access does popup.

@Injectable()
export class MediaService {
  private readonly logger = new Logger(this.constructor.name);

  constructor(private readonly media: Media, private readonly file: File) {}

  async recordAudio(): Promise<void> {
    const path = this.file.dataDirectory;
    const name = 'recording.mp3';
    const file = await this.file.createFile(path, name, true);
    console.log('file native url', file.nativeURL);

    const mediaFile: MediaObject = this.media.create(file.nativeURL);
    mediaFile.startRecord();
    await wait(10000);
    this.logger.debug('recording stopped');
    mediaFile.stopRecord();
    await wait(1000);
    this.logger.debug('playing started');
    mediaFile.play();
  }
}