请教一个网页视频播放问题

[MarkToWin]

B 站的视频解析出来是两个 m4s 格式的媒体流，分别是视频和音频； 前端要怎么处理才能播放视频，而且拥有正常的视频播放控件； video 只能加载其中的一个 m4s ，而不能合并在一起播放，是要做什么预处理工作么，或者是有什么成熟的播放组件可以实现； 对前端这块也不熟悉，特来请教。

[ReZer0]

我前几天用 B 站客户端下载的时候也发现了这个问题，这个 m4s 用 poyplayer 无法直接播放，不知道是不是做了什么手脚。

[MarkToWin]

@ReZer0 #1 可以用 potplayer 播放的吧，只是没声音，需要用 ffmpeg 进行音视频的合成一下；我地址解析做好了，只是不知道在前端怎么进行加载，我看 B 站的播放器的 src 地址是一个 blob 开头的，不知道是怎么进行预处理了；

[ReZer0]

@MarkToWin 播不了，刚查了下，说是啊 B 在 m4s 文件开头添加了几个 16 进制字符，导致播放器无法识别。网上说法是下个编辑器啥的把啊 B 自己添加的删了就能直接播放了。

[xing666]

试试 Plyr.js+Hls.js

[zkl2333]

查阅谷歌可知 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 可以谷歌搜搜看。

[HTML001]

如果拿到的是两个媒体流，把两个媒体流（ MediaStream ）的音视频轨道（ MediaStreamTrack ）拿出来（ MediaStream.getTracks()），然后自己 new 一个 MediaStream ，再把音频轨道和视频轨道添加到 new 的 MediaStream 里面，再通过 video 播放这个 MediaStream 就可以了吧，没实践过，看这种方式能不能操作

[MarkToWin]

@xing666 我找下资料研究下；

[MarkToWin]

@zkl2333 我是想在对 B 站的视频进行解析后，直接在浏览器环境进行播放的；下载合并这个我用 ffmpeg 实现倒是挺方便的，我去研究下 dash.js

[MarkToWin]

@HTML001 这个方向能实现最好不过，只需要客户端资源，在浏览器环境进行实现，不需要后端做什么处理；

[chnwillliu]

浏览器的 media source API