移动Safari - 等到<video>完全下载后再播放-Java 学习之路

我正在构建一个具有相当复杂的 <video> 体验的网站，其中包括跳转视频's timeline quite a bit. In order for it to work as smoothly as possible, it'，最好不要在视频完全缓冲之前开始播放 .

我有这个设置并在桌面浏览器中工作（`preload =“auto”主要是我需要去的地方）但当然移动浏览器不会预加载内容并需要用户交互来启动视频缓冲 .

我的问题：在移动Safari中，用户点击播放之后是否有可能在视频完全下载之前没有播放视频？

我正在使用Popcorn HTML5媒体框架，如果有帮助的话 .

1 回答

有一个名为canplaythrough的DOM事件，您可以在JavaScript中订阅 . 当浏览器估计它可以播放整个视频而不暂停缓冲时，将调用此事件 .

EDIT ：同样，您可以使用 progress 事件来确定已缓冲的视频量：

var player = document.getElementById('video_player'); // The <video> element
player.addEventListener('progress', onVideoProgressUpdate, false);

function onVideoProgressUpdate(e) {
    var percentageBuffered = 0;

    if (player.buffered.length > 0 && player.buffered.end && player.duration) {
        percentageBuffered = player.buffered.end(0) / player.duration;
    } else if (player.bytesTotal != undefined && player.bytesTotal > 0 && player.bufferedBytes != undefined) {
        percentageBuffered = player.bufferedBytes / player.bytesTotal;
    }

    if (percentageBuffered == 1) { // 100% of the video has been buffered
        player.Play();
    }
}

回复于 2024-04-20T13:28:24+08:00

移动Safari - 等到<video>完全下载后再播放

1 回答

相关问题