微信小程序-音频播放每次都是重复播放同一条录音

前言

在调试微信小程序音频播放时，刚开始我也是直接复制官方文档的实例：

const innerAudioContext = wx.createInnerAudioContext()
innerAudioContext.autoplay = true
innerAudioContext.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'
innerAudioContext.onPlay(() => {console.log('开始播放')
})
innerAudioContext.onError((res) => {console.log(res.errMsg)console.log(res.errCode)
})

然而此时就出现了，无论按多少下都是重复播放同一条语音的情况！

从 https://blog.csdn.net/qq_39364032/article/details/79742120 得知，wx.createInnerAudioContext()这个api新建了一个实例之后，需要销毁实例，才能重新new一个实例。所以，我做了以下改动：

const innerAudioContext = wx.createInnerAudioContext()innerAudioContext.autoplay = trueinnerAudioContext.src = res.tempFilePathinnerAudioContext.onPlay(() => {console.log('开始播放')})innerAudioContext.onStop(() => {console.log('i am onStop')innerAudioContext.stop()//播放停止，销毁该实例innerAudioContext.destroy()})innerAudioContext.onEnded(() => {console.log('i am onEnded')//播放结束，销毁该实例innerAudioContext.destroy()console.log('已执行destory()')})innerAudioContext.onError((res) => {console.log(res.errMsg)console.log(res.errCode)innerAudioContext.destroy()})

最终解决方案

然而！无论我执行多少次，还是播放第一条语音！从我的后台来看，每次返回的语音文件都是不同的，甚至我把服务器上的文件下载到本地，也是不同的！于是我就怀疑它下载过一次这个地址就不再下载了。所以我又换一种写法，在上面加上wx.downloadFile这个api。

wx.downloadFile({url: 'http://47.106.74.22:8081/voice/download_audio', //仅为示例，并非真实的资源success: function (res) {// 只要服务器有响应数据，就会把响应内容写入文件并进入 success 回调，业务需要自行判断是否下载到了想要的内容if (res.statusCode === 200) {const innerAudioContext = wx.createInnerAudioContext()innerAudioContext.autoplay = trueinnerAudioContext.src = res.tempFilePathinnerAudioContext.onPlay(() => {console.log('开始播放')})innerAudioContext.onStop(() => {console.log('i am onStop')innerAudioContext.stop()//播放停止，销毁该实例innerAudioContext.destroy()})innerAudioContext.onEnded(() => {console.log('i am onEnded')//播放结束，销毁该实例innerAudioContext.destroy()console.log('已执行destory()')})innerAudioContext.onError((res) => {console.log(res.errMsg)console.log(res.errCode)innerAudioContext.destroy()})}}})

到这里，终于解决这个问题

注意的是，wx.createInnerAudioContext()无法播放wav文件，于是这里我用的是MP3文件。而wx.playVoice(OBJECT)也无法播放mp3文件。

微信小程序-音频播放每次都是重复播放同一条录音相关推荐

微信小程序-音频播放-wx.createInnerAudioContext() 每次都是重复播放同一条录音
前言在调试微信小程序音频播放时,刚开始我也是直接复制官方文档的实例: const innerAudioContext = wx.createInnerAudioContext() innerAudi ...
uniapp实现微信小程序音频播放倒计时的功能，类似微信语音条
uniapp实现微信小程序音频播放功能最近需要有个项目需要用到音频播放,第一个想到的是audio标签,但是查阅了uniapp官方文档,发现audio组件已经不维护了. 官网推荐使用uni.creat ...
优化微信小程序音频播放，实现多音频同时播放，互不干扰。
原理就是创建5个 innerAudioContext实例化对象,轮流调用.(小程序只能同时存在5个音频实例). 附上demo: const innerAudioContext1 = wx.create ...
微信小程序音频播放，可拖动进度条，可有时间显示
首先来展示一下效果: 中间的播放条以及下面的浮窗就是我们呈现的最终效果. 音频播放使用的组件是: wx.getBackgroundAudioManager(); 在wx.request()中首先初始音 ...
微信小程序 - 音频播放进度条和点击拖动的控制，支持自定义音乐播放控件样式布局（wx.createAudioContext）解决各种 InnerAudioContext.onTimeUpdate不执行
前言网上有很多关于 InnerAudioContext.onTimeUpdate 不执行.失效的问题,都导致播放进度条无法做了,本文完美解决. 本文实现了自定义播放音频控件样式,且支持播放进度条显 ...
微信小程序音频相关问题：播放，录音等相关
其实我也知道音频问题,十分尴尬,可以参考的资料极少,研究者也不多,所处的教程也基本是基础的内容,稍微深入几乎一篇都没有:所以前段时间我就准备弄的东西,一直没弄,因为没资料去弄,但是今天,看到一个同学遇 ...
微信小程序音乐播放器
趁周末做一个简单的微信小程序音乐播放器,源码已留. 播放列表首页wxml <swiper class="swiper" indicator-dots='{{swipterSe ...
微信小程序中播放海康萤石云HLS '.m3u8'视频 video标签
微信小程序中播放海康萤石云HLS '.m3u8'视频 video标签前言萤石云开放平台微信开发者工具前言因为项目需要在微信小程序上展示实时视频流信息,以下内容是我将萤石云平台官方文档和自己实 ...
微信小程序音频播放功能createInnerAudioContext
微信小程序音频播放功能createInnerAudioContext 效果: 前端界面代码: <view class="cu-modal {{ModalName=='DialogMo ...

微信小程序-音频播放每次都是重复播放同一条录音

前言

最终解决方案

微信小程序-音频播放每次都是重复播放同一条录音相关推荐

最新文章

热门文章

微信小程序-音频播放 每次都是重复播放同一条录音

前言

最终解决方案

微信小程序-音频播放 每次都是重复播放同一条录音相关推荐

最新文章

热门文章

微信小程序-音频播放每次都是重复播放同一条录音

微信小程序-音频播放每次都是重复播放同一条录音相关推荐