gpt4 book ai didi

firefox - HTML5 视频卡顿/运行不流畅/缓冲和预加载

转载 作者:行者123 更新时间:2023-12-03 21:40:13 25 4
gpt4 key购买 nike

我的主页上正在播放视频。我的 html 看起来像这样:

<video id="player" style="display: inline;">
<source id="src1" type="video/webm" src="uploads/tx_frmovieportfolio/film_05.webm">
<source id="src2" type="video/ogg" src="uploads/tx_frmovieportfolio/film_05.ogv">
<source id="src3" type="video/mp4" src="uploads/tx_frmovieportfolio/film_05.mp4">
Your Browser does not support HTML5 video.
</video>

我正在通过 jQuery 通过单击链接更改源。我还构建了自己的控制栏。非常适合它。但:

在 Chrome 中,视频加载速度非常快,并且播放得很好,没有任何问题。
在 Firefox 24 和 Opera 12.16 中,视频加载很慢并且一直在暂停。我认为它正在加载新框架。这需要很多时间。我也用 autobuffer 和 preload="true"试过了,即使第二个已经过时了。但它不会改变任何东西。

有什么解决方法,我可以做些什么让它在所有实际浏览器中快速工作?否则使用视频标签是没有意义的。

获得一些想法或完美的解决方案会很棒。 :) 。

福克

最佳答案

在您提出问题七年后,我遇到了同样的问题。手头的问题是您的浏览器正在尝试缓冲非常大的视频文件,并且某些浏览器比其他浏览器处理得更好。最重要的是,您受制于他们的互联网连接速度和可用内存。
解决方案是将您的视频转码为 Apple's HTTP Live Streaming (HLS)格式。这是 most widely supported format从 2020 年开始,它的工作原理是将您的视频拆分为 H.264/H.265 编码的短片段,每个片段的持续时间只有几秒钟,并存储为单独的文件。生成的 list (.m3u8) 充当索引,您的视频播放器读取该索引以仅下载您需要的片段。
以下是如何使用 FFMPEG 将 MPEG2 视频转码为 HLS VOD 格式的示例:

ffmpeg -i InputVideo.mpg -vf scale=w=352:h=240:force_original_aspect_ratio=decrease -c:a aac -ar 44100 -b:a 64k -c:v h264 -profile:v main -crf 20 -g 48 -keyint_min 48 -sc_threshold 0 -b:v 700k -maxrate 900k -bufsize 1400k -hls_time 4 -hls_playlist_type vod -hls_segment_filename hls/%03d.ts hls/OutputVideo.m3u8
随着 Chrome Android > v70、Android 浏览器和 Safari >= 6 都原生支持 HLS,对 HLS 的原始浏览器支持越来越好。您可以通过使用 JWPlayer 来实现几乎通用的兼容性。或 Video.js而不是 HTML5 视频对象。

关于firefox - HTML5 视频卡顿/运行不流畅/缓冲和预加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21206959/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com