一、背景
如果你问一个前端技术人员，近几年最火的前端框架技术是什么，必定会有人说 VUE，的确 VUE 凭借其简略个性博得了大家的青睐，而近期公司有个我的项目，须要在 VUE 框架网页上播放 RTSP 实时视频。
小编对目前市场上的所有计划进行了测试，发现市面上行大部分计划都是转码转流计划，须要服务器不停的转码转流，不仅提早高，能达到几秒甚至几分钟，播放高清视频或者 H.265 格局视频容易卡顿，同时多路播放成果也差，比方 WebAssembly 甚至本地录像抓图性能都不能实现，很难用于商业。
二、计划
1. 服务器转流前端转码计划
服务器端先把 RTSP 流用 Web Socket 或 WebRTC 推送到前端，再通过 WASM 转码 MP4 播放。此计划虽号称是无插件计划，然而须要服务器反对，两次转码导致提早较高，个别高达数秒甚至数分钟。此计划首屏画面显示很慢。因为须要服务器一直转码转流，对 CPU 和内存耗费较大，带宽占用高，长期综合应用老本也很高。如果多路播放或者看高分辨率或 H.265 视频，很可能就会呈现卡顿、花屏等状况。
综合来看，此计划摄像头较少或者对提早、画面要求较低的需要，商用难堪重任。
2. 服务器转码转流再转码计划
原理是服务器端先把 RTSP 流转 FLV 后，再用 Web Socket 或 WebRTC 推送到前端，而后再转为 MP4 播放。目前在高版本浏览器（除 IE 外）中，曾经反对 WASM 技术，能够应用此技术在终端电脑上把 RTSP 视频流转码后播放。此计划同样须要服务器的反对，因为在终端电脑转码，终端电脑配置好坏决定了播放品质，并且因为 WASM 只能软解码，无奈利用终端电脑的减速能力，且不反对多线程，不反对水印、字幕及本地录像及抓图等，多路播放或者 H.265 格局视频，也容易呈现卡顿、花屏等状况，大量占用电脑 CPU 和内存，电脑无奈再做其余事件，体验十分不好。
综合来看，此计划也尽量慎用。
3. 低版本浏览器计划（VLC 原生播放插件）：
2015 年之前 Chrome 等浏览器还未勾销对 NPAPI 插件反对的时候计划，持续应用低版本 Chrome、Firefox 等浏览器，通过 VLC 原生播放器间接播放，也不须要服务器反对，提早非常低，终端也能够应用硬件的减速能力，多路播放也毫无压力。
毛病也非常明显：无奈应用最新的浏览器和操作系统，不适宜商用。如果能解决高版本的 Chrome、Firefox、Edge 等浏览器应用，此计划无疑是最佳抉择！
4. 最终降级计划：猿巨匠内嵌 VLC 原生播放程序
猿巨匠的 VLC 播放程序是基于猿巨匠中间件提供的内嵌网页播放的专利技术，底层调用 VLC 客户端的 ActiveX 控件可实现在 Chrome 等高版本浏览器中内嵌播放海康威视、大华等摄像头的 RTSP 视频流。因为理论调用的是 VLC 本地原生播放控件，因而可充分利用本机硬件加速能力实现高效硬解码播放多路或高清视频 (H.265)，低提早至 300 毫秒，反对回访、抓图、录像，最多可反对 25 路同时播放，最低可用在 Chrome 41、Firefox 50、Edge 80(Chromium 内核)、360 极速 / 平安、IE、Oprea 36、QQ 等浏览器，也兼容运行于这些浏览器的最新版本。
与大华官网网页提早比照：
https://www.bilibili.com/vide…
与海康威视官网网页提早比照：
https://www.bilibili.com/vide…