如何解决当它们的来源是.m3u8实时URI时,如何同步<audio>和<video>标签?
我的html很简单:
<video muted playsinline id="vid"></video>
<audio id="aud"></audio>
然后我要用javascript做的是,用两个m3u8 hls网址,
https://streaming.xyz.com/b/playlist.m3u8
https://streaming.xyz.com/c/playlist.m3u8
然后附加
var video = document.getElementById("vid");
var audio = document.getElementById("aud");
audio.setAttribute("src","https://streaming.xyz.com/b/playlist.m3u8")
video.setAttribute("src","https://streaming.xyz.com/c/playlist.m3u8")
然后加载
audio.load()
video.load()
然后附加侦听器以加载清单
video.addEventListener("loadedmetadata",() => {
video.play()
})
audio.addEventListener("loadedmetadata",() => {
audio.play()
})
我看到音频和视频当前时间之间存在延迟。平均大约2-3秒,甚至随着时间的流逝或接近而漂移。
audio.currentTime = video.currentTime
不起作用,可能是因为它们是实时播放列表(持续时间值为+ infinity)
谁能告诉我如何进行同步?确保两个标签同时播放,即使将来它们分开,我也可以同步它们吗?如何确定是否有人缓冲或停止我可以重新装载一个缓冲/已停止的缓冲并与另一个同步重新开始?
请注意,它们是 Live Hls Urls ,而我 需要具有这两个标签(音频,视频) 。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。