海康威视、大华摄像头RTSP视频流嵌入到谷歌Chrome等VUE页面中实时播放方案（图文教程）

vue

近期在做一个智慧城市项目，要求将海康威视、大华等摄像头RTSP视频流在Chrome、Firefox、Edge等浏览器中播放，并且要求延迟必须要低，能到多低就多低，最好是实时视频。

小编了解很多不同的方案，目前市面上大部分是转码转流方案，不仅需要服务器支持，并且需要服务器不停的转码转流，如果多路同时播放或者播放高清视频，非常容易出现卡顿、花屏等情况，延迟更是高达数秒甚至数分钟，对于一些延迟要求较高的项目来说，这简直是灾难性后果。

想比较之下猿大师VLC播放程序是性价比最高的一个方案，通过猿大师的内嵌网页技术，底层调用VLC的ActiveX控件，可以实现在网页中内嵌播放多路RTSP的实时视频流，不用服务器转码转流，可以做到低延迟（300毫秒），支持H.264和H.265格式，兼容主流浏览器的老版本和最新版本。

下面小编用图文为大家介绍下体验步骤：

第一步：

下载安装VLC桌面版播放器，如果不想安装任何程序，可以直接下载免安装的绿色版VLC播放器，解压缩就可以了，不用了可以直接删掉。

下载地址：

64位：http://download.videolan.org/pub/videolan/vlc/3.0.16/win64/vlc-3.0.16-win64.7z

32位：http://download.videolan.org/pub/videolan/vlc/3.0.16/win32/vlc-3.0.16-win32.7z

第二步：
下载猿大师中间件，同样我们也给不想安装的程序的同学准备了免安装的猿大师绿色版，下载地址：点击这里下载解压缩后运行：InstallWrl.bat 启动即可。

第三步：
启动猿大师后会有如下弹窗，包含UID等信息，请截图发给猿大师客服开通试用授权。

第四步：
打开猿大师VLC播放程序在线体验网试用：以全页面显示为例，首先点击连接，右侧会显示连接成功，如果没有成功，请确认本机83端口是否被占用，如果被占用。然后再把真实RTSP地址替换到下面蓝色区域，然后点击发送即可。

如果没有测试用摄像头，可以从网上找公开的RTSP地址进行测试，小编找到一个（rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov），不太清晰，不过可以凑合用。

用猿大师的VLC播放器与海康威视官方网页播放RTSP延迟效果对比下！