前端大神们, h5 video 怎么可以流畅倒序播放

2022-06-29 19:24:00 +08:00
 hhxiaolei
业务需求,需要点击按钮实现视频倒序流畅播放,

现在代码通过递减修改视频当前播放时间实现,但是效果很卡顿,有什么更好的方法吗?谢谢
1977 次点击
所在节点    问与答
12 条回复
Xusually
2022-06-29 19:32:43 +08:00
递减播放时间每个小片段还是在正着放 只不过是多个时间片段往后移
倒放我只会 ffmpeg reverse
逃)
lynan
2022-06-29 20:13:41 +08:00
使用 oss 的处理能力获得一份倒播的视频。
因为一个视频你要倒播,必然是从最后一帧开始,如果视频很大,你需要完整地下载完成以后才能拿到最后一帧。
然后是客户端处理视频开销太大了。js ,还是算了吧
zythum
2022-06-29 20:18:17 +08:00
处理视频, 让内容不要做差帧。但是视频体积会变大

ffmpeg -c:v libx264 -vf "format=yuv420p" -g 1
muzuiget
2022-06-29 21:35:22 +08:00
很难,首先视频编码每一个 fragment (即最小解码单位),里面的帧并不一定按播放时间顺序编码的,所以你至少把一个 fragment 所有帧解码后,把所有帧倒序画到画面上。

但是浏览器没有提供这种 API ,当然可以用 WASM 软解硬杠,但是显然很难达到流畅播放的要求。

所以还是预处理,在服务器用 ffmpeg 倒序重编码一次,然后切片生成 DASH 文件,用 JavaScript 控制播放进度,就可以无缝切换。
shintendo
2022-06-29 21:58:16 +08:00
什么鬼畜的业务需求
jink2018us
2022-06-30 00:57:01 +08:00
做视频的来回答一下,流畅倒放对视频的编码有要求,所以单前端做不到流畅。死心吧
Rocketer
2022-06-30 01:04:13 +08:00
显然产品经理不知道压缩过的视频每一帧都是建立在前面帧的基础上的。

你跟他讨论一下怎么倒着建楼吧,先建最高层,然后逐渐往下建。
Bijiabo
2022-06-30 07:56:45 +08:00
HTML5 没有提供硬件解码底层 API ,这个需求纯靠前端暂时无法做到。要看你具体场景,如果是应用内嵌页面,交由原生实现。如果是纯网页,让后端预处理吧
jifengg
2022-06-30 09:20:09 +08:00
别说 web 了,就是原生平台,你也很难找到可以实时倒放视频的播放器。
弄正反俩视频来切换播放吧。
Liam1997
2022-06-30 10:53:56 +08:00
TENET 是吧
dengshen
2022-06-30 13:24:00 +08:00
把原视频传上去后保存一份后反转在传一份🐶 然后正序播放反转的视频
zhttp
2022-06-30 19:13:12 +08:00
先找到最后一个 GOP ,然后全部解码,从后往前送显,逻辑上并不复杂,问题在于一次性解码二三十帧,内存会吃掉多少,解码性能够用不?感觉还是后台准备好一个正序一个倒序两个视频比较靠谱。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/863016

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX