B 站的视频解析出来是两个 m4s 格式的媒体流,分别是视频和音频; 前端要怎么处理才能播放视频,而且拥有正常的视频播放控件; video 只能加载其中的一个 m4s ,而不能合并在一起播放,是要做什么预处理工作么,或者是有什么成熟的播放组件可以实现; 对前端这块也不熟悉,特来请教。
1
ReZer0 114 天前
我前几天用 B 站客户端下载的时候也发现了这个问题,这个 m4s 用 poyplayer 无法直接播放,不知道是不是做了什么手脚。
|
2
MarkToWin OP @ReZer0 #1 可以用 potplayer 播放的吧,只是没声音,需要用 ffmpeg 进行音视频的合成一下;我地址解析做好了,只是不知道在前端怎么进行加载,我看 B 站的播放器的 src 地址是一个 blob 开头的,不知道是怎么进行预处理了;
|
3
ReZer0 113 天前
@MarkToWin 播不了,刚查了下,说是啊 B 在 m4s 文件开头添加了几个 16 进制字符,导致播放器无法识别。网上说法是下个编辑器啥的把啊 B 自己添加的删了就能直接播放了。
|
4
xing666 113 天前
试试 Plyr.js+Hls.js
|
5
zkl2333 113 天前
查阅谷歌可知 m4s 是 MPEG-DASH 的数据片段。
因为我自己只玩过 HLS 的 m3u8 ,没玩过 DASH ,所以以下是没测试的不负责任推测: 前端可以使用 [dash.js]( https://github.com/Dash-Industry-Forum/dash.js) 解析。知名的支持 DASH 的前端播放器组件有 [DPlayer]( https://github.com/DIYgod/DPlayer)、[ArtPlayer]( https://github.com/zhw2590582/ArtPlayer)。 这是 ArtPlayer 官方是一个 demo: https://artplayer.org/?libs=https://cdnjs.cloudflare.com/ajax/libs/dashjs/4.5.2/dash.all.min.js&example=dash 但是如果哔哩哔哩是有修改的实现,上面的直接用大概率不行,可能要考虑改源码。我觉得这种情况还是预处理最简单,直接播放 mp4 肯定不出错。B 站视频转 mp4 这方面我一搜一堆文章,OP 可以谷歌搜搜看。 |
6
HTML001 113 天前
如果拿到的是两个媒体流,把两个媒体流( MediaStream )的音视频轨道( MediaStreamTrack )拿出来( MediaStream.getTracks()),然后自己 new 一个 MediaStream ,再把音频轨道和视频轨道添加到 new 的 MediaStream 里面,再通过 video 播放这个 MediaStream 就可以了吧,没实践过,看这种方式能不能操作
|
8
MarkToWin OP @zkl2333 我是想在对 B 站的视频进行解析后,直接在浏览器环境进行播放的;下载合并这个我用 ffmpeg 实现倒是挺方便的,我去研究下 dash.js
|
10
chnwillliu 110 天前 via Android
浏览器的 media source API
|