1. 程式人生 > >網頁播放rtsp視訊流

網頁播放rtsp視訊流

RTSP協議
(1)是流媒體協議。
(2)RTSP協議是共有協議,並有專門機構做維護。
(3)RTSP協議一般傳輸的是 ts、mp4 格式的流。
(4)RTSP傳輸一般需要 2-3 個通道,命令和資料通道分離。

1、vlc player
如果客戶使用ie或者firefox的話,可以使用vlc player,vlc player 同樣需要安裝外掛,需要電腦上安裝vlc player的本地客戶端(安裝時勾選外掛選項),然後通過 標籤來引入播放https://www.videolan.org/,經測試發現,在IE8中可以正常執行,顯示視訊,在IE11和chrome瀏覽器中均不支援。

<!--[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/latest/win32/axvlc.cab" width="720" height="540"> <param name='mrl' value='rtsp://184.72.239.149/vod/mp4:BigBuckBunny_175k.mov'
/> <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="1720" 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://184.72.239.149/vod/mp4:BigBuckBunny_175k.mov' /> <param name='volume' value='50' /> <param name='autoplay' value='true' /> <param name='loop' value='false' /> <param name='fullscreen' value='false' /> </object> <!--<![endif]-->
<object CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="1000px" height="600px" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
        <!--<param name="src" value="sample.mov">-->
        <param name="qtsrc" value="rtsp://184.72.239.149/vod/mp4:BigBuckBunny_175k.mov">
        <param name="autoplay" value="true">
        <param name="loop" value="false">
        <param name="controller" value="true">
        <embed  qtsrc="rtsp://184.72.239.149/vod/mp4:BigBuckBunny_175k.mov" width="1320px" height="756px" autoplay="true" loop="false" controller="true" pluginspage="http://www.apple.com/quicktime/"></embed>
    </object>

3、H5- streamedian
參考地址:https://streamedian.com/#demo ,支援chrome無外掛播放,上述兩個都需要安裝客戶端外掛,streamedian不需要,但是其他瀏覽器不支援

<video id="test_video" controls autoplay>
    <!--<source src="rtsp://184.72.239.149/vod/mp4:BigBuckBunny_175k.mov" type="application/x-rtsp">-->
    <source src="rtsp://184.72.239.149/vod/mp4:BigBuckBunny_175k.mov" type="application/x-rtsp">
</video>
<script src="streamedian.js"></script>