1. 程式人生 > >用HTML5播放IPCamera視訊

用HTML5播放IPCamera視訊

HTML5增加了vedio標籤,能直接播放視訊,但是播放的格式是有限的。

這裡將IPCamera的視訊轉換OGG格式,再通過HTML5網頁播放,播放還是很清晰的。IPCamera要支援RTSP等視訊流協議,taobao上100多的很多IPCamera都支援。這裡所有的操作都是同一臺電腦上進行.

電腦上要裝的軟體:
VLC    V2.1.3 視訊轉碼軟體
Apache V2.2   HTTP伺服器
IPCamera IP地址:192.168.1.11
電腦IP:192.168.1.10

一,通過VLC轉碼
1.Media->Stream->Network,輸入IPCamera的視訊流地址,這個地址可以問賣攝像頭的人要,或直接問廠家要,我的地址為:

rtsp://192.168.1.11:554/user=admin&password=&channel=1&stream=0.sdp?real_stream


2.點選底下的Stream->Next->Http,點選Add->在Path處寫上/stream,轉換出來的視訊流地址為http://192.168.1.10:8080/stream


3.點選Next->選擇要轉換成的編碼格式:Video-Theora+Vorbis(OGG)

4.點選Next->Stream即可,這時VLC標題欄顯示Streaming,說明已經在轉碼

二,網頁
Apache的安裝使用很簡單,不懂的地方可參考下網上的.我安裝的目錄為D:\Apache2.2,
網頁的路徑預設在D:\Apache2.2\htdocs,該目錄下的檔案只有一個index.html:
index.html內容:
<!DOCTYPE html>
<html>
<body>
<video controls>  
  <source src="http://192.168.1.10:8080/stream" type="video/ogg">
  Your browser does not support the video tag.
</video>
</body>
</html>
二, 開啟瀏覽器,輸入電腦的IP地址192.168.1.10,點選左下角的“播放”即可播放視訊.瀏覽器要用chrome的,試了IE不行。