Ionic4--录音组件封装

1.安装插件 Media

ionic cordova plugin add cordova-plugin-media

npm install @ionic-native/media

2. app.module.ts 申明引用

import { Media } from '@ionic-native/media/ngx';

providers:[Media]

3.创建service服务组件

ionic g

选择 service

4.实现录音方法

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

public filePath: any; //录音文件的名字
public recordData: any; //录音对象
public progress: number = 0;
private isRecording: boolean = false

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

//开始录音
startReocrd() {
    if (this.isRecording == true) {
      this.recordData.stopRecord();
      this.isRecording = false
    }
    if (this.tool.devicePlatformType() == 1) {//iOS
      this.filePath = this.file.tempDirectory.replace(/^file:\/\//, '') + "Record.m4a";
      this.file.createFile(this.file.tempDirectory, 'Record.m4a', true).then(() => {
        this.recordData = this.media.create(this.filePath);
        this.recordData.startRecord();
        this.isRecording = true
      }).catch(() => {
        this.isRecording = false
        console.log("创建文件失败了")
      })

    } else if (this.tool.devicePlatformType() == 2) {//android

      this.filePath = this.file.cacheDirectory+'Record.m4a';
      this.file.createFile(this.file.cacheDirectory, 'Record.m4a', true).then(() => {
        this.recordData = this.media.create(this.filePath);
        this.recordData.startRecord();//开始录音
        this.isRecording = true
      }).catch(() => {
        this.isRecording = false
        console.log("创建文件失败了")
      })
    }
}

//暂停录音
pauseRecord() {
    this.recordData.pauseRecord();
}
//播放录音
play() {
    this.recordData.play();
}
//继续播放录音
resumeRecord() {
    this.recordData.resumeRecord();
}
//停止结束录音
stopRecord() {
    this.recordData.stopRecord();
    this.isRecording = false
}

//获取录音文件
this.recording.recordData.onSuccess.subscribe(() =>
        this.httpUploadRecording()
);

5.添加权限

iOS： 

<config-file parent="NSMicrophoneUsageDescription" platform="ios" target="*-Info.plist">

<string>允许访问您的麦克风以便录制声音</string>

</config-file>

android：

<config-file parent="/manifest" platform="android" target="AndroidManifest.xml" xmlns:android="http://schemas.android.com/apk/res/android">

<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />

</config-file>

  

<config-file parent="/manifest" platform="android" target="AndroidManifest.xml" xmlns:android="http://schemas.android.com/apk/res/android">

<uses-permission android:name="android.permission.RECORD_AUDIO" />

</config-file>

6.需要注意的几点

1.iOS和android 创建录音文件的目录是不一样的，需要设置不一样的目录

2.直接创建录音文件可能会不成功，需要使用file先创建一个文件

3.iOS录音格式只能是m4a和wav

4.iOS文件路径需要去掉【file:】前缀