利用vlc插件将IP摄像头嵌入网页和网页播放RTSP流

原创 2015年07月06日 19:49:25

1. 描述

 最近有一个项目需要将IP摄像机的画面嵌入到web网页中,考虑到减少开发成本,使用vlc插件播放摄像头提供的RTSP流。在videolan wiki的官网详细介绍了关于vlc web plugin的使用方法。
 有一点需要注意的是,vlc2.2.0以前的版本,wiki上提供的方法却不再适用。原因是vlc的last一个版本中没有axvlc.cab文件了,最新的的一个在0.9.2版本对应的目录中。而且在IE中还回应为这个cab文件没有签名而无法安装此插件。
 before


2. 解决办法

  使用2.2.0以后的vlc版本,vlc插件的安装方法可参考vlc_help上的说明进行安装。windows下安装vlc客户端并勾选activeX plugin和mozilla plugin。
  编写页面的测试程序如下:

<html>
<head>
<title>web camera test</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

</head>

<body bgcolor="white" text="black">
<embed type="application/x-vlc-plugin" pluginspage="http://www.videola.org"
    width="640" height="480" id="vlc" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" target="rtsp://user:passwd@192.168.1.34:554" >

</body>
</html>

  如果要判断浏览器是否安装了vlc插件,没有装插件的话跳转到vlc的下载链接里,可用以下javascript代码(需要在html中body标签里加上onload="checkBrowser();"选项。):
  

<script type="text/javascript">  
         //仅适用于IE浏览器是,并且安装有vlc插件,则返回true;  
            function isInsalledIEVLC(){    
                var vlcObj = null;  
                var vlcInstalled= false;   
                try {  
                    vlcObj = new ActiveXObject("VideoLAN.Vlcplugin.1");   
                    if( vlcObj != null ){   
                        vlcInstalled = true   
                    }  
                } catch (e) {  
                    vlcInstalled= false;  
                }          
                return vlcInstalled;  
            }   

            //仅适用于firefox浏览器是,并且安装有vlc插件,则返回true;  
            function isInsalledFFVLC(){  
                 var numPlugins=navigator.plugins.length;  
                 for  (i=0;i<numPlugins;i++){   
                      plugin=navigator.plugins[i];  
                      if(plugin.name.indexOf("VideoLAN") > -1 || plugin.name.indexOf("VLC") > -1){   
                         return true;  
                    }  
                 }  
                 return false;  
            }  

                   /* 浏览器检测 */  
            function checkBrowser(){  
                var browser=navigator.appName  
                var b_version=navigator.appVersion  
                var version=parseFloat(b_version)  
                if ( browser=="Netscape"  && version>=4) {  
                    if(isInsalledFFVLC()){  
                        alert("已装VLC插件");  
                    }else{  
                        alert("未装VLC插件");
            location.href="http://download.videolan.org/pub/videolan/vlc/2.2.1/";  
                    }  
                }else if(browser=="Microsoft Internet Explorer" && version>=4) {  
                    if(isInsalledIEVLC()){  
                        alert("已装VLC插件");  
                    }else{  
                        alert("未装VLC插件,请先安装插件");
                    location.href="http://download.videolan.org/pub/videolan/vlc/2.2.1/";
                    }  
                }  
            }  
     </script>

相关文章推荐

VLC在web系统中应用(x-vlc-plugin 即如何把VLC嵌入HTML中)

VLC毫无疑问是优秀的一款播放软件,子B/S机构的web项目中,如果能把它嵌入页面,做页面预览或者其他,是非常棒的。 第一步:下载VLC安装程序;(推荐1.0.3或者是1.0.5版本,比较稳定) ...

网页中加入VLC的播放RTSP流的控件

代码例子,加入就能在网页中播放RTSP流。

网页中插入VLC播放器播放rtsp视频流步骤

网页中插入VLC播放器播放rtsp视频流步骤!

在HTML网页中插入VLC视频或者windows media player视频

VLC: ...

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

浏览器中流媒体(rtsp)播放

在Android应用中嵌入系统播放器可以使用Mediaplayer实例完成,但是如何打开系统播放器呢?(就是例如浏览网页,遇到一个rtsp链接,点击之后直接启动播放器) 首先由于我们的内容在网络上,我...

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

最简单的VLC网页播放器

我们用VLC播放器安装VLC的active插件后,默认情况下liang

vlc的网页播放

使用的浏览器为IE11,firebox 48.0.2  和 google chrome  版本 50.0.2661.87 m 1.首先看源代码 var itemId = 0; ...
  • dykCSDN
  • dykCSDN
  • 2016年09月09日 21:23
  • 437
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:利用vlc插件将IP摄像头嵌入网页和网页播放RTSP流
举报原因:
原因补充:

(最多只允许输入30个字)