@aochuang/common 1.0.1 → 1.0.126

package/common/voice/voice.vue

@@ -0,0 +1,274 @@
+<script>
+import VoicePlayer from './voice-player'
+import VoicePlayerAudio from './voice-player-audio'
+import VoicePlayerAac from './voice-player-aac.js'
+import { getExtByFileSrc } from '../../utils/file'
+import { formatOssPath } from '../../utils/oss'
+import { createPromise } from '../../utils/util.js'
+
+export default {
+  name: 'AcVoice',
+  provide () {
+    return {
+      AcVoice: this
+    }
+  },
+  props: {
+    /**
+     * 播放模式
+     * local：本地播放模式，主要是用来聊天记录离线情况
+     * default：可以对amr格式音频文件进行解码播放
+     * auto: 自动模式，如果非amr那么使用voicePlayerAudio播放，否则使用voicePlayer播放
+    */
+    mode: {
+      type: String,
+      default: 'auto',
+      validator (value) {
+        return ['local', 'default', 'auto'].indexOf(value) >= 0
+      }
+    }
+  },
+  data () {
+    return {
+      ready: false,
+      currPosition: 0,
+      totalPosition: 0,
+      percentage: 0,
+      playRate: 1,
+      playId: null,
+      playStatus: null, // 播放状态，play：播放中,stop:已停止,pause:已暂停
+      playUrl: null,
+      loading: false,
+      starting: false,
+      errorMsgMap: {}
+    }
+  },
+  computed: {
+    player () {
+      if (!this.ready) {
+        return
+      }
+      let player = null
+      if (this.mode === 'default') {
+        player = this.amrPlayer
+      } else if (this.mode === 'local') {
+        player = this.audioPlayer
+      } else {
+        if (this.playUrl) {
+          const ext = getExtByFileSrc(this.playUrl)
+          if (ext === 'mp3' || ext === 'wav') {
+            player = this.audioPlayer
+          } else if (ext === 'aac') {
+            player = this.aacPlayer
+          } else {
+            player = this.amrPlayer
+          }
+        } else {
+          player = this.amrPlayer
+        }
+      }
+      return player
+    }
+  },
+  watch: {
+    player (newPlayer, oldPlayer) {
+      if (newPlayer === oldPlayer) {
+        return
+      }
+      if (oldPlayer) {
+        oldPlayer.stop()
+      }
+    }
+  },
+  created () {
+    const newFactory = (Factory, options) => {
+      return new Factory(Object.assign({
+        playRate: this.playRate,
+        onError: (e) => {
+          this.starting = false
+          this.$set(this.errorMsgMap, this.playId, e.message || '未知错误')
+          this.$emit('error', Object.assign({
+            playId:  this.playId
+          }, e))
+        },
+        onPlay: () => {
+          this.starting = false
+          const evtData = {
+            playRawData: null
+          }
+          if (this.amrPlayer && this.amrPlayer.getRawData) {
+            evtData.playRawData = this.amrPlayer.getRawData() // 提供这个数据给外面保存为wav格式
+          }
+          this.$emit('playing', evtData)
+          this._resetPosition()
+        },
+        onPlaying: (evt) => {
+          this.currPosition = evt.currPosition
+          this.totalPosition = evt.totalPosition
+          this.percentage = (this.currPosition / this.totalPosition) * 100
+        },
+        onPause: () => {
+          if (this.playEndPromise) {
+            this.playEndPromise && this.playEndPromise.resolve()
+          }
+        },
+        onEnded: () => {
+          // this.starting = false
+          // this.playId = null
+          console.log('onEnded')
+          if (this.playEndPromise) {
+            this.playEndPromise.then(() => {
+              this.playStatus = 'ended'
+            })
+            this.playEndPromise && this.playEndPromise.resolve()
+          }
+          this.$emit('end')
+        }
+      }, options))
+    }
+    if (this.mode === 'auto') {
+      this.amrPlayer = newFactory(VoicePlayer)
+      this.audioPlayer = newFactory(VoicePlayerAudio)
+      this.aacPlayer = newFactory(VoicePlayerAac)
+    } else if (this.mode === 'default') {
+      this.amrPlayer = newFactory(VoicePlayer)
+    } else if (this.mode === 'local') {
+      this.audioPlayer = newFactory(VoicePlayerAudio)
+    }
+    this.ready = true
+  },
+  beforeDestroy () {
+    this.amrPlayer && this.amrPlayer.destroy()
+    this.audioPlayer && this.audioPlayer.destroy()
+    this.aacPlayer && this.aacPlayer.destroy()
+  },
+  methods: {
+    convertToWavByUrl (url) {
+      return new Promise((resolve, reject) => {
+        if (!this.amrPlayer) {
+          reject('只有arm模式支持转化')
+        } else {
+          this.amrPlayer.convertToWavByUrl(url).then(resolve, reject)
+        }
+      })
+    },
+    convertToWavByBuffer (buffer) {
+      return new Promise((resolve, reject) => {
+        if (!this.amrPlayer) {
+          reject('只有arm模式支持转化')
+        } else {
+          this.amrPlayer.convertToWavByBuffer(buffer).then(resolve, reject)
+        }
+      })
+    },
+    start (id, val, total, cb) {
+      return new Promise((resolve) => {
+        this.stop()
+        const playEndPromise = this.playEndPromise || Promise.resolve()
+        playEndPromise.finally(() => {
+          this.playEndPromise = createPromise()
+          val = formatOssPath(val)
+          this.starting = true
+          this.playUrl = val
+          this.$delete(this.errorMsgMap, id)
+          this.$nextTick(() => {
+            this.player.setUrl(val, (ctx) => {
+              cb && cb(ctx)
+              this._resetPosition(total)
+              this.playId = id
+              this.playStatus = 'play'
+              Promise.all([
+                this.player.start()
+              ]).finally(() => {
+                resolve()
+              })
+            })
+          })
+        })
+      })
+    },
+    pause () {
+      if (this.player instanceof VoicePlayerAac) {
+        // aac不支持暂停，直接停止
+        this.stop()
+      } else {
+        this.playStatus = 'pause'
+        this.player.pause()
+      }
+    },
+    resume () {
+      this.playStatus = 'play'
+      this.player.resume()
+    },
+    stop () {
+      this.starting = false
+      this.playId = null
+      this.playStatus = 'stop'
+      this.player.stop()
+    },
+    isPlaying (id) {
+      return this.playStatus === 'play' && this.playId === id
+    },
+    isPause (id) {
+      return this.playStatus === 'pause' && this.playId === id
+    },
+    isSuperChangeRate (url) {
+      let isChangeRate = true
+      if (url) {
+        const ext = getExtByFileSrc(url)
+        if (ext === 'aac') {
+          isChangeRate = false
+        }
+      }
+      return isChangeRate
+    },
+    isSuperChangeProgress (url) {
+      let isChangeProgress = true
+      if (url) {
+        const ext = getExtByFileSrc(url)
+        if (ext === 'aac') {
+          if (!this.aacPlayer || this.aacPlayer.isUseBigFile(this.aacPlayer.audioData)) {
+            isChangeProgress = false
+          }
+        }
+      }
+      return isChangeProgress
+    },
+    getErrorMsg (id) {
+      if (this.errorMsgMap[id] === 'Maximum call stack size exceeded') {
+        return '该录音文件太大，不支持播放'
+      }
+      return this.errorMsgMap[id]
+    },
+    _resetPosition (total) {
+      this.totalPosition = total
+      this.percentage = (this.currPosition / this.totalPosition) * 100
+    },
+    setPosition (pos) {
+      this.currPosition = pos || 0
+      this.percentage = (this.currPosition / this.totalPosition) * 100
+      this.player.setPosition(this.currPosition)
+    },
+    setPlaybackRate (rate) {
+      if (this.player) {
+        this.playRate = rate
+        this.player.setPlaybackRate(rate)
+      }
+    },
+    remove (id) {
+      if (this.isPlaying(id)) {
+        this.stop()
+      }
+      this.$delete(this.errorMsgMap, id)
+    }
+  },
+  render () {
+    return this.$slots.default
+  }
+}
+</script>
+<style lang="less">
+.ac-voice{
+  display: none;
+}
+</style>

package/common/voice-player/index.js

@@ -0,0 +1,3 @@
+import AcVoicePlayer from './voice-player'
+
+export default AcVoicePlayer