前言

目前做的項(xiàng)目，需要Web端顯示實(shí)時(shí)視頻數(shù)據(jù)。本次項(xiàng)目使用的是?？低暤臄z像頭進(jìn)行實(shí)時(shí)監(jiān)控。

硬件：螢石的攝像頭(海康威視旗下的)，?？低暤挠脖P錄像機(jī)。

軟件：vlc 2.2.6版本。

Web端和移動(dòng)端接入螢石云平臺(tái)的視頻數(shù)據(jù)? https://blog.csdn.net/qq_38289815/article/details/92615824

海康威視Web端視頻開發(fā) https://blog.csdn.net/qq_38289815/article/details/92428396

螢石云攝像頭Http接口云臺(tái)控制開發(fā) https://blog.csdn.net/qq_38289815/article/details/94288310

前期工作：

將視頻攝像頭和?？低暤挠脖P錄像機(jī)連接在同一網(wǎng)段，并設(shè)置好硬盤錄像機(jī)的IP地址和端口號(hào)。攝像頭要通過通道管理設(shè)置通道號(hào)，IP通道地址等。

下載 vlc ：

地址：http://download.videolan.org/vlc/2.2.6/win64/

安裝好vlc后進(jìn)行如下操作

(1)打開媒體中的流

(2)在網(wǎng)絡(luò)中設(shè)置RTSP并選擇串流

參數(shù)如下：

(3)點(diǎn)擊下一個(gè)后在新目標(biāo)選擇HTTP并點(diǎn)擊添加

(4)設(shè)置端口和路徑

(5)選擇Video - Theor + Vorbis (OGG)

(6)選擇流所有通量流，最后點(diǎn)擊流結(jié)束設(shè)置

沒有報(bào)錯(cuò)時(shí)，可以打開網(wǎng)絡(luò)串流后點(diǎn)擊播放。如果報(bào)錯(cuò)了，需要檢查相應(yīng)的參數(shù)有沒有填寫對(duì)，也有可能是端口被占用的情況。

正常顯示圖像

完成上述工作后，在Web端復(fù)制如下代碼：

<object type='application/x-vlc-plugin' pluginspage="http://www.videolan.org/" id='vlc' events='false' width="720" height="410">
    <param name='mrl' value='rtsp://[賬號(hào)]:[密碼]@[設(shè)備IP地址]/MPEG-4/ch1/main/av_stream' />
    <param name='volume' value='50' />
    <param name='autoplay' value='true' />
    <param name='loop' value='false' />
    <param name='fullscreen' value='false' />
    <param name='controls' value='false' />
</object>
<video src="http://[本機(jī)IP地址]:[端口]/testVideo" width="600" height="450" autoplay="autoplay"  loop="loop"></video>

統(tǒng)一回復(fù)一下各位遇到問題的小伙伴，這個(gè)方法是我之前嘗試過的，現(xiàn)在身邊已經(jīng)沒有相應(yīng)的設(shè)備和環(huán)境了，想復(fù)現(xiàn)比較難。如果遇到 vlc 播放器有視頻數(shù)據(jù)而網(wǎng)頁沒有顯示，則應(yīng)該檢查 IP、端口號(hào)、vlc版本問題和硬盤錄像機(jī)的設(shè)置。若本機(jī) IP 沒有錯(cuò)，可以多嘗試幾個(gè)端口(盡量往大了試)，看能不能解決問題。如果這個(gè)方法不行，可以嘗試一下開頭的其他方式。

注意：攝像頭和硬盤錄像機(jī)不在同一網(wǎng)段可能導(dǎo)致無法顯示圖像。