《浏览器播放RTSP方案》之 VXGPlayer插件播放RTSP视频流

VXGPlayer插件播放RTSP视频流

总体来说vxgplayer是付费插件，更多支持的功能可以去官网详询。作为一个demo研究，检索资料和实现总结如下：

环境搭建

别人有一篇文章总结的很好，就不赘述。直接上链接整合vxgPlayer使chrome支持vxg_media_player播放rtsp视频

关于如何安装多chrome浏览器, 可以参考我的另一篇 VLC插件播放RTSP视频流-多版本chrome安装

实例代码

// 项目目录
// │  index.html
// └─lib
//     media_player.nmf
//     media_player.pexe
//     vxgplayer-1.8.40.min.css
//     vxgplayer-1.8.40.min.js// 完整代码
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>测试video 视频资源获取与播放</title><script type="text/javascript" src="./lib/vxgplayer-1.8.40.min.js"></script><link rel="stylesheet" href="./lib/vxgplayer-1.8.40.min.css">
</head>
<body><div class="test-page"><span> 测试video 视频资源获取与播放</span><div onclick="playVideo()" class="btn-vis">点击播放视频</div><div class="video-warp" v-show="videoWarpShow"><div onclick="closeV()" class="close">x</div><div class="vxgplayer" id="vxg_media_player1" url="" aspect-ratio latency="10" autostart controls avsync nmf-src="./lib/media_player.nmf" nmf-path="media_player.nmf"width="600" height="600"></div></div></div><script>function closeV() {window.vxgplayer('vxg_media_player1').stop();}function playVideo() {window.vxgplayer('vxg_media_player1').stop();window.vxgplayer('vxg_media_player1').src("wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mov");window.vxgplayer('vxg_media_player1').play();}</script>
</body>
</html>