评论

InnerAudioContext.seek 跳转失效或跳转后 .onTimeUpdate 失效不刷新的问题解决方法

在进行音频跳转 InnerAudioContext.seek 后 InnerAudioContext.onTimeUpdate 失效不刷新的问题解决方法

首先说,seek() 跳转成功,但是 .onTimeUpdate 不刷新的问题:

const _InnerAudioContext = wx.createInnerAudioContext()
_InnerAudioContext.autoplay = true
Page({
  data: {
  },
  onLoadfunction (options{
    _InnerAudioContext.src = 'http://sp.9sky.com/convert/song/music/1030028/20210721151849987.mp3'
    _InnerAudioContext.onTimeUpdate(() => {
      console.log(_InnerAudioContext.currentTime);


    })
  },
  forwardfunction () {
    _InnerAudioContext.pause()  // 先暂停
    _InnerAudioContext.seek(31) // 再跳转
    setTimeout(() => {
      _InnerAudioContext.play()
    }, 500);   // 给一个延迟,再播放
  }
})


.seek()跳转失败,音频从头播放的问题:

在具体使用过程中,发现还有一个问题,如果使用的音频所在的服务器不支持断点续传,那么 seek() 会从头开始播放。解决方法:

第一种解决方法:配置服务器,支持断点续传;

第二种解决方法:使用小程序云开发的存储,不会存在跳转失败的问题。

第三种解决方法:下载到本地后获取到临时链接,然后播放。

wx.downloadFile({
            url: 'https://www.xxx.com/test/audio.mp3',
            success(res) {
                if (res.statusCode === 200) {
                    _InnerAudioContext.src = res.tempFilePath
                }
            }
        })
最后一次编辑于  2021-07-26  
点赞 4
收藏
评论

6 个评论

  • _
    _
    2022-11-13

    感谢老铁,解决了。。坑了我两天。。。 当音频第一次播放的时候随便seek ,当第一次播放完毕之后,如果再使用seek ,不管seek多少秒 ,就死活都是从头开始。真是想吐了。。


    我是使用第一种解决方法:【配置服务器,支持断点续传;】 这里要解释一下说法要正确描述一下。 不是后台需要支持断点续传,而是音频的http链接,需要后台支持分段读取,也就是 音频文件的http 链接要支持HTTP Range 请求。不懂的去查下Http Range 怎么支持吧


    2022-11-13
    赞同 2
    回复
  • _@我大概是只,成功的猫
    _@我大概是只,成功的猫
    08-20

    下载到本地播放,调用 seek 后,currentTime 被设置成 0

    08-20
    赞同
    回复
  • Dao
    Dao
    2022-05-28

    问题得到了解决,感谢分享。

    2022-05-28
    赞同
    回复
  • Yeung
    Yeung
    2021-11-25
    你好。 我在文件下载后设置src , 并通过你上述的方法进行 pause 和 seek .这并无问题。 
    在切换下一首歌时 也是进行同样的下载和流程。
    但在返回上一首歌时。用上一首下载好的 tempFilePath 设置给src。 这时候onTimeUpdate 便不会在触发了。 
    这个问题困扰我挺久
    
    
    2021-11-25
    赞同
    回复
  • 葫芦客
    葫芦客
    2021-11-08

    感谢,问题解决了^_^

    2021-11-08
    赞同
    回复
  • Weicup
    Weicup
    2021-10-15

    音频还是会重头播放。。用的是云开发的存储

    2021-10-15
    赞同
    回复 2
    • 觀·自在
      觀·自在
      2021-10-22
      下载到本地,然后播放试试呢?
      2021-10-22
      回复
    • 陌忆
      陌忆
      10-29回复觀·自在
      下载本地还是不行
      10-29
      回复
登录 后发表内容