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

转载于 https://blog.csdn.net/a600849155/article/details/81356576

前言

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


 
  1. const innerAudioContext = wx.createInnerAudioContext()

  2. innerAudioContext.autoplay = true

  3. innerAudioContext.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'

  4. innerAudioContext.onPlay(() => {

  5. console.log('开始播放')

  6. })

  7. innerAudioContext.onError((res) => {

  8. console.log(res.errMsg)

  9. console.log(res.errCode)

  10. })

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

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


 
  1. const innerAudioContext = wx.createInnerAudioContext()

  2. innerAudioContext.autoplay = true

  3. innerAudioContext.src = res.tempFilePath

  4. innerAudioContext.onPlay(() => {

  5. console.log('开始播放')

  6.  
  7. })

  8. innerAudioContext.onStop(() => {

  9. console.log('i am onStop')

  10. innerAudioContext.stop()

  11. //播放停止,销毁该实例

  12. innerAudioContext.destroy()

  13.  
  14. })

  15. innerAudioContext.onEnded(() => {

  16. console.log('i am onEnded')

  17. //播放结束,销毁该实例

  18. innerAudioContext.destroy()

  19. console.log('已执行destory()')

  20. })

  21. innerAudioContext.onError((res) => {

  22. console.log(res.errMsg)

  23. console.log(res.errCode)

  24. innerAudioContext.destroy()

  25. })

最终解决方案

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


 
  1. wx.downloadFile({

  2. url: 'http://47.106.74.22:8081/voice/download_audio', //仅为示例,并非真实的资源

  3. success: function (res) {

  4. // 只要服务器有响应数据,就会把响应内容写入文件并进入 success 回调,业务需要自行判断是否下载到了想要的内容

  5. if (res.statusCode === 200) {

  6.  
  7. const innerAudioContext = wx.createInnerAudioContext()

  8. innerAudioContext.autoplay = true

  9. innerAudioContext.src = res.tempFilePath

  10. innerAudioContext.onPlay(() => {

  11. console.log('开始播放')

  12.  
  13. })

  14. innerAudioContext.onStop(() => {

  15. console.log('i am onStop')

  16. innerAudioContext.stop()

  17. //播放停止,销毁该实例

  18. innerAudioContext.destroy()

  19.  
  20. })

  21. innerAudioContext.onEnded(() => {

  22. console.log('i am onEnded')

  23. //播放结束,销毁该实例

  24. innerAudioContext.destroy()

  25. console.log('已执行destory()')

  26. })

  27. innerAudioContext.onError((res) => {

  28. console.log(res.errMsg)

  29. console.log(res.errCode)

  30. innerAudioContext.destroy()

  31. })

  32. }

  33. }

  34. })

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

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

--------------------- 本文来自 Himhin 的CSDN 博客 ,全文地址请点击:https://blog.csdn.net/a600849155/article/details/81356576?utm_source=copy

没有更多推荐了,返回首页