chrome不支持Flash后，网页要怎么播放视频流RTSP/RTP等格式

Question

之前用了videojs这个插件来播放视频流，这个插件其实是用flash来播放的，但是2020年底chrome不在支持flash，之后网页端要怎么实现实时视频的播放？
B站的看他直播有HTML5和Flash两种播放选项，但是Html5只支持MP4,它又是怎么实现直播的呢？
请教下各位

Answer 1

HTML5 并不是只支持 MP4，Media Source Extension（MSE） 了解一下？

事实上已经有两种协议支持视频流并且可以直接用 HTML5 Video 来播放，HLS 和 DASH，safari 支持 HLS，chrome 可能觉得支持 MSE 所以 HLS 就不原生支持了； DASH 是比较新的协议，还没有原生支持的。不过借助 MSE 是能够在不支持的浏览器上实现 HLS 和 DASH 的。HLS/DASH 延时相对较长，低延时方案可以用 websocket 配合 MSE 来实现。

MSE 可以让你用代码来控制媒体流中的数据源，把数据封装喂给 audio / video 来呈现。而获取数据的方式可以是前端能做到的任意方式，fetch/XHR 或者 Websocket 都行。这里就需要一台后端服务器把 rtsp 转成 websocket 来传输(ffmpeg)，前端通过 websocket 接收数据，再通过 MSE 喂给 Video 标签来展示。

另外 WebRTC 也可以做到低延时视频流回放，有兴趣可以了解一下。

Answer 2

楼主可以试试免费开源的flv.js原理是在服务端先把RTSP视频流转换为flv后用Web Socket或WebRTC推送到前端，前端收到后再转换为Video所支持的MP4后播放，但是此方案需要转码两次，延迟最少2-3秒，服务器转码专利对CPU、内存、带宽宽带压力都很大，成本也会非常高，不是最优的方案。
而猿大师中间件提供了一个统一的不依赖浏览器本身扩展技术的外接系统，能实现当前主流浏览器的全兼容，包括低版本的Chrome和IE浏览器，不仅延迟低（500毫秒以内），还可以实现多路RTSP同时播放，不用转码转流，实施成本也非常低！