vue播放amr格式音频
生活随笔
收集整理的這篇文章主要介紹了
vue播放amr格式音频
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
安裝
該插件支持將瀏覽器?<audio>?所支持的音頻格式(例如 MP3 或 OGG 音頻)轉換成 AMR 音頻。
npm i benz-amr-recorder --save引入
import BenzAMRRecorder from "benz-amr-recorder";使用(組件可直接復制粘貼使用)
<template><div class="myaudio"><span @click="openRecording">{{ msg }}</span></div> </template><script> import BenzAMRRecorder from "benz-amr-recorder"; export default {props: {audioUrl: {type: String,required: true,},},name: "VueAudio",data() {return {amr: null, //播放對象msg: "點擊播放",};},methods: {//播放語音openRecording() {if (this.amr !== null) {this.stopPlayVoice();}this.amr = new BenzAMRRecorder(); //建立console.log(this.amr);//??注意跨域問題this.amr.initWithUrl(this.audioUrl) //初始化.then(() => {this.amr.play(); //播放this.msg = "點擊暫停";this.amr.onEnded(() => {this.msg = "點擊播放";});}).catch((e) => {this.msg = "點擊播放";this.$message.error("播放錄音失敗");});},//停止播放stopPlayVoice() {if (this.amr.isPlaying()) {this.amr.stop();this.msg = "點擊播放";}},}, }; </script> <style lang="scss" scoped> .myaudio {span {color: #409eff;}span:hover {cursor: pointer;} } </style>?更多使用參考benz-amr-recorder - npm
總結
以上是生活随笔為你收集整理的vue播放amr格式音频的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 小米官网项目制作——javascript
- 下一篇: webshell检测方式深度剖析 ---