網頁播放rtsp流媒體

 解決方法：

1.搭建Red5流媒體服務器(其餘還有CRTMPD、NGINX-RTMP、SRS)

2.FFmpeg(其餘還有live555)實現監控攝像頭的RTSP協議轉RTMP協議直播

3.搭建WEB服務器播放RTMP視頻流直播(其餘流：HTTP-FLV流、HLS、RTP)

搭建Red5流媒體服務器

1.下載安裝包：https://builds.apache.org/view/M-R/view/OpenMeetings/job/red5-installer/

2.安裝過程一路next，直到提示輸入IP時，輸入0.0.0.0。提示輸入Port時，輸入5080。這裏實際上我輸入過127.0.0.1做爲IP，因爲在本機上測試沒有出現過問題。但網上提示，若是跨服務器部署，這裏輸入0.0.0.0是有必要的。

3.設置環境變量

4.啓動Red5服務

若是啓動不了，請檢查前面的環境變量設置是否設置完畢而且正確，最後檢查Red5的啓動日誌文件，看看是否有相應的提示信息，日誌文件在Red5主目錄下的log目錄下，日誌文件有多個，查看red5_service.log便可。啓動後，打開瀏覽器，敲入安裝Red5時的IP地址和端口，正常狀況下，看到以下信息，說明Red5已經正確安裝了。

這個時候能夠點擊Install進入下載其官方提供的demo進行研究學習，安裝後的demo文件在Red5根目錄下的webapps下，如D:\Red5\webapps。安裝操做比較簡單，這裏不詳細介紹，不過要這裏要提醒一下，安裝完的demo後，須要從新啓動一下Red5服務器，重啓操做參考上面的介紹。

FFmpeg實現監控攝像頭的RTSP協議轉RTMP協議直播

1.下載FFmpeg:http://ffmpeg.org/download.html

2.下載完直接解壓好，並將bin目錄加入到path環境變量下便可。

3.運行

　　ffmpeg -i "rtsp://admin:12345@192.168.1.77:554/cam/realmonitor?channel=1&subtype=0" -f flv -r 25 -s 640x480 -an "rtmp://localhost/oflaDemo/hello"

成功後：

 

4.搭建WEB服務器，利用jwplayer或者ckplayer之類的，將rtmp地址換成第三步轉的rtmp協議地址

例如用ckplayer:

<script type="text/javascript" src="ckplayer/x/ckplayer.js"></script>
<div class="video" style="width: 1000px;height: 600px;"></div>
<script type="text/javascript">
    var videoObject = {
        container: '.video',//「#」表明容器的ID，「.」或「」表明容器的class
        variable: 'player',//該屬性必需設置，值等於下面的new chplayer()的對象
        autoplay:true,//自動播放
        live:true,//直播視頻形式
        video:'rtmp://localhost/oflaDemo/hello'//視頻地址
    };
    var player=new ckplayer(videoObject);
</script>

成功後頁面：

 參考資料：http://blog.csdn.net/chengshangqian/article/details/8567804