阅读(405)评论(0)

banner

这阵子做了一个音乐播放器,才意识到ios上的safari浏览器是后台无法自动播放音乐的。

关于html5 audio标签,有几个基本事件

audio加载事件
  • loadstart 提示音频的元数据已加载
  • durationchange 提示视频的时长已改变
  • loadedmetadata 提示音频的元数据已加载
  • loadeddata 提示当前帧的数据是可用的
  • progress 提示视频正在下载中
  • canplay 提示该视频已准备好开始播放
  • canplaythrough 提示视频能够不停顿地一直播放

依次是如上几个事件

在chrome中,canplay事件后,音乐即可以播放,有声音。

然而在safari中,只有canplaythrough事件后,音乐才开始播放。

在ios11中,我在audio标签中加入autoplay是可以自动播放的,并不存在无法自动播放的情况,然而缓冲时间较chrome久,原因如上,safari在canplaythrough事件后才开始播放

在safari是当前正打开的程序,并且播放器页面是safari当前页,并且手机无锁屏时,是可以通过JS改变audiosrc自动切换到下一首的。

在safari处于后台时,是无法通过改变audiosrc切换音乐了,我研究了下。

loadstartloadeddatacanplay事件时播放音乐是可以实现后台切换音乐的。

 //就绪
    onCanplay = e => {
        const audio = this.refs.audio;
        audio.play();
    };

但这样还有2个问题

  • safari处于其他页面,无法自动播放
  • 手机锁屏超过一定时间后无法自动播放

第一点可能是safari的机制,我还没找到解决办法 第二点我猜测是ios锁屏一段时间后禁止了safari的刷新与联网,这个无解,safari属于ios自带应用,无法设置后台自动刷新

此外safari后台运行时间久后也无法自动播放,大概能正常播放3首左右,不想折腾了~~~//

发表评论

评论

暂无评论

    本日の格言
    博主闪亮登场!

    不要停止奔跑,不要回顾来路,来路无可眷恋,值得期待的只有前方。
    by 马男波杰克

    超想说
    博主の友人
    对!就是这种低调,如同吃了炫迈
    超有爱
    TOP