一尘不染

HTML5视频:强制中止缓冲

html

如何在HTML5视频上强制中止事件?我有一个叠加层,当我关闭它时,视频应该暂停播放,然后 停止缓冲 。但是,我的互联网连接仍然发疯。哦,我在Mac OS
X 10.6上使用Chrome 7.0.5。

我已经尝试了几件事-没有一个起作用:

(对于那些不熟悉XUI的人,x $就像jQuery的包装函数一样)

首先,调度中止HTML事件:

var videoEl = x$('#video_el')[0];
videoEl.pause();
var evObj = document.createEvent('HTMLEvents');
evObj.initEvent('abort', false, false);
videoEl.dispatchEvent(evObj);

接下来,更改src,然后强制加载:

var videoEl = x$('#video_el')[0];
videoEl.pause();
videoEl.src = "";
videoEl.load(); //tried with and without this step

编辑:我的视频元素看起来像这样:

<video id="video_el" src="<video_url>" preload="none" controls="controls" />

同样,这些都不起作用。有人遇到过这个问题吗?有什么建议么?

总而言之,我试图强制HTML5视频元素停止缓冲。

谢谢!


阅读 524

收藏
2020-05-10

共1个答案

一尘不染

好的,所以在过去的几天里,我一直在努力解决这个问题。
这是我的分析和解决方案:

简而言之,我尝试解决的问题是:
我注意到HTML5播放器暂停时,播放器并没有停止下载(完全没有,即使经过了一段合理的时间)。通过使用24/7音频流并开发移动网站,我意识到考虑到如果访客保持开放状态会占用大量数据,这对我的访问者来说并不是最佳选择-
尽管我确实认为我可以通过“忽略”让一些电信公司感到非常高兴“这个问题。
只是为了澄清,我并不真正关心固定长度的文件。在大多数情况下,下载完整文件是查看联机资源(认为连接缓慢)所需的功能,因此我没有尝试阻止此功能。

分析:
HTML5音频元素没有stop()函数,也没有可以设置允许缓冲的数据量的选项,或者说您希望元素停止缓冲的一种方式-
Don请勿将其与“预加载”功能混淆,这仅适用于单击播放按钮之前的元素。
我不知道为什么会这样,为什么无法使用此功能。如果有人能向我解释为什么这些关键功能没有按标准执行,该标准应该使手机的Web开发更好,更标准化,我很想知道。

解决方案:
我发现在音频元素中实现(多种)停止功能的唯一可行解决方案如下:
1.暂停当前播放器-您可以通过audio.addEventListener(’pause’, yourFunction);
2.将源设置为空-audio.src =“”;
3.加载src-audio.load();
4.删除整个音频元素
。5.插入未定义源的新HTML5音频元素
。6.设置源(首先存在的源)-audio.src =“旧源URL”
。7.重挂暂停事件-audio.addEventListener(’pause’,current-function);

对于iOS,必须完全注入新的HTML5音频播放器。只需重置src,然后加载它,就我而言,会导致播放器“自动播放” …

对于懒惰的人(包括jQuery):

var audio = $("audio").get(0);
audio.pause(0);
var tmp = audio.src;
audio.src = "";
audio.load();
$("audio").remove();

$("#audio-player").html("<audio controls preload='none'></audio>");<br>
audio = $("audio").get(0);
audio.src = tmp;
audio.addEventListener('pause', current-function);

按下暂停将使您的访客失去音频/视频文件中的当前位置,并且它将重新开始。我没有解决这个问题的方法。再说一次,如果您要处理实时流,此解决方案应该没问题。

希望这可以帮助。

2020-05-10