利用vlc外掛程式將IP網路攝影機嵌入網頁和網頁播放RTSP流，vlcrtsp

最後更新：2015-07-08 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

利用vlc外掛程式將IP網路攝影機嵌入網頁和網頁播放RTSP流，vlcrtsp
1. 描述

　最近有一個項目需要將IP攝像機的畫面嵌入到web網頁中，考慮到減少開發成本，使用vlc外掛程式播放網路攝影機提供的RTSP流。在videolan wiki的官網詳細介紹了關於vlc web plugin的使用方法。
　有一點需要注意的是，vlc2.2.0以前的版本，wiki上提供的方法卻不再適用。原因是vlc的last一個版本中沒有axvlc.cab檔案了，最新的的一個在0.9.2版本對應的目錄中。而且在IE中還回應為這個cab檔案沒有簽名而無法安裝此外掛程式。
　

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>

著作權聲明：本文為博主原創文章，未經博主允許不得轉載。

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More