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

VLC插件播放RTSP视频流

多版本chrome安装
安装vlc软件
开启浏览器的NPAPI设置
编写测试页
插件设置
其他问题
最后

目前网页对于RTSP流直接播放不支持，目前有插件和转流两种方式，这里针对vlc插件播放做一个简单的梳理。

查看官网教程 vlcWebPlugin, 得知其浏览器支持情况：

这是因为因为谷歌启用了新的插件PPAPI，认为新的更安全，所以NPAPI设置在chrome45及以后不再支持。

鉴于开发者主要使用chrome，所以我们需要首先安装一个v44版本的chrome浏览器。而且我们电脑上基本已经有一个最新版本的chrome浏览器了，所以这里需要同时安装不同版本的chrome。

多版本chrome安装

参考文章一台电脑安装多个版本google Chorme方案，进行对应版本安装。主要分为两步：

版本文件下载和解压
安装路径 user-data-dir 设置

安装vlc软件

从 vlc官网下载vlc软件进行安装，安装过程中需要勾选插件支持：

开启浏览器的NPAPI设置

浏览器地址栏输入： chrome://flags/#enable-npapi，找到 启用NPAPI插件 ，点击启用。

编写测试页

新建一个index.html文件，如下：

// index.html<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>Test VLC Plugins</title>
</head>
<body><!--[if IE]><object type='application/x-vlc-plugin' id='vlc' events='True'classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' codebase="http://downloads.videolan.org/pub/videolan/vlc-webplugins/2.0.6/npapi-vlc-2.0.6.tar.x" width="720" height="540"><param name='mrl' value='rtsp://admin:admin@10.10.10.10/264/' /><param name='volume' value='50' /><param name='autoplay' value='true' /><param name='loop' value='false' /><param name='fullscreen' value='false' /></object>
<![endif]--><!--[if !IE]><!--><object type='application/x-vlc-plugin' id='vlc' events='True' width="720" height="540"pluginspage="http://www.videolan.org"codebase="http://downloads.videolan.org/pub/videolan/vlc-webplugins/2.0.6/npapi-vlc-2.0.6.tar.xz"><param name='mrl' value='rtsp://admin:admin@10.10.10.10/264/' /><param name='volume' value='50' /><param name='autoplay' value='true' /><param name='loop' value='false' /><param name='controls' value='false' /><param name='fullscreen' value='true' /></object><!--<![endif]-->
</body>
</html>

此时，我们用chrome44打开，页面还是会出现插件图标，鼠标悬浮，提示如下：

右键运行此插件, 视频即可正常播放。那么有没有方式可以打开立即播放呢，
这就需要设置该插件 始终允许运行 。

插件设置

地址栏输入： chrome://plugins/, 找到 VLC Web Plugin，勾选 始终允许运行。

其他问题

安装chrome44版本后打开始终显示

可以在快捷方式的目标地址后加入
–no-sandbox, 如下：

最后

希望这篇文章对你们有用， happy coding~