Spring boot web 使用 Chrome 显示 RTSP协议的视频流

1.安装 chrome 插件 VXG Media Player

插件可以在chrome的商城找到

 

2.创建spring boot web 的项目

其中需要使用到vxg media Player的插件，可以下载大佬的git 项目

git clone https://github.com/VideoExpertsGroup/Chrome.RTSP.Player.git

 

下载完成后进入项目根目录，使用"npm install"命令打包

npm install 
npm run build

完成后从dist文件夹拷贝 目录pnacl 和文件vxgplayer-1.8.2.min.css、vxgplayer-1.8.2.min.js到自己项目的根目录

 

自己的项目目录结构如下

 

index.html 代码片段

<div class="vxgplayer" id="vxg_media_player1"
    url="rtsp://3.84.6.190/vod/mp4:BigBuckBunny_115k.mov" autostart controls
     avsync nmf-src>
</div>
<script type="text/javascript" src="/js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="/js/vxgplayer-1.8.2.min.js"></script>

 

项目运行后，打开页面就能看到效果

注意：新版本chrome不再支持此插件所使用的PNaCl ,我这里所使用的版本为chrome 67.0