遇到此问题的情形:
单位开发app采用的Hybrid混合开发模式,有些列表页,详情页都是H5页面,我这边的框架是vue写的。最近一个项目中涉及到了视频和音频的展示和播放,因为app有安卓端和ios端,视频和音频的上传都是原生去上传的,然后再详情页中需要展示出来,ios中音频没遇到问题,因为ios自己录音生成的是.mp3格式音频,所以用audio标签可以完美播放。(audio标签支持的格式只有MP3, Wav, 和 Ogg),*
问题就出在了安卓端,项目中发现安卓录音以后生成的音频格式是amr的,所以不能播放
这时候首先想到的是让安卓处理生成音频格式,但是安卓人员说比较麻烦不好弄,项目马上就要上线了没时间整,只能从我H5这边想想办法,好吧,谁叫咋是配合人家的呢。
当时我想到的解决思路,有大神有别的解决思路欢迎交流学习
- 前端接收到接口返回的amr音频后,做一个类型转换,amr转mp3,(虽然说一切二进制的东西都可以随便转换格式,但是本人水平有限,所以。。。)
- 既然audio不能用,那就不用他,于是乎网上各种找资料,最后锁定benz-amr-recorder
代码部分
首先下载依赖到项目中
npm install benz-amr-recorder
然后在需要的文件中引入,完成实例化