@neosjs/h5-recorder v1.1.3

H5 录音

Html5 JS 录音 mp3 wav 格式，支持 pc 和 Android、ios 部分浏览器

安装

npm install @neosjs/h5-recorder -S

# 或者

yarn add @neosjs/h5-recorder

当前版本 1.0.4

API 接口

• Recorder.init(object)
• Recorder.startRecord()
• Recorder.stopRecord()
• Recorder.closeRecord()
• Recorder.getRecordBlob()
• Recorder.pauseRecord()
• Recorder.resumeRecord()
• Recorder.playRecord(audioDomId)
• Recorder.getRecordSrc(blobFile)
• Recorder.createWaves(config={},canvasDomId)
• Recorder.uploadRecord(url, method , callback)
• Recorder.isSupport()

示例代码

初始化

import Recorder from '@neosjs/h5-recorder'

// 初始化录音机
Recorder.init(
  {
    type: 'wav', // 音频类型
    sampleRate: 16000, // 码率
    bitRate: 16, // 采用数位
    waveForm: {
      type: 'wave', // 波形类型
      dom: '.waveContent' // 波形容器 css选择器
    }
  },
  cb => {
    switch (cb.action) {
      case 'initState': // 初始化状态
        console.log(cb.data)
        break
      case 'connectRecord': // 连接录音
        console.log(cb.data)
        break
      case 'disconnectRecord': // 断开录音连接
        console.log(cb.data)
        break
      case 'startRecord': // 开始录音
        console.log(cb.data)
        break
      case 'stopRecord': // 停止录音
        console.log(cb.data)
        break
      case 'closeRecord': // 关闭录音、释放资源
        console.log(cb.data)
        break
      case 'pauseRecord': // 暂停录音
        console.log(cb.data)
        break
      case 'resumeRecord': // 恢复录音
        console.log(cb.data)
        break
      case 'playRecord': // 播放录音
        console.log(cb.data)
        break
      case 'isSupport': // 浏览器是否支持H5录音功能
        console.log(cb.data)
        break
      default:
    }
  }
)

初试化参数

开始录音

import Recorder from '@neosjs/h5-recorder'

Recorder.startRecord()

停止录音

import Recorder from '@neosjs/h5-recorder'

Recorder.stopRecord(success, fail)
// 或者
const res = await Recorder.stopRecord()

参数

关闭录音

import Recorder from '@neosjs/h5-recorder'

Recorder.closeRecord()

:::danger 不需要录音的时候，必须调用此接口，关闭录音，释放资源！ :::

播放录音

import Recorder from '@neosjs/h5-recorder'

Recorder.playRecord(audioDomId)

参数

暂停录音

import Recorder from '@neosjs/h5-recorder'

Recorder.pauseRecord()

恢复录音

import Recorder from '@neosjs/h5-recorder'

Recorder.resumeRecord()

获取录音文件

import Recorder from '@neosjs/h5-recorder'

Recorder.getRecordBlob()

获取本地 src 地址

import Recorder from '@neosjs/h5-recorder'

Recorder.getRecordSrc(blobFile)

参数

创建一个波形图

import Recorder from '@neosjs/h5-recorder'

Recorder.createWaves(config, canvasDomId)

参数

上传音频文件

import Recorder from '@neosjs/h5-recorder'

Recorder.uploadRecord(url, method, callback)

参数

获取浏览器是否支持录音

import Recorder from '@neosjs/h5-recorder'

Recorder.isSupport()
// 接口返回 true、false