由於要在web進行rtsp流的直播,在網上找到vlc插件可以實現(目前只有IE支持activex,所以只能用IE瀏覽器,我用的是IE11,操作系統爲英文版win7,64位)。果斷下載安裝,查找vlc的開發資料。程序寫好後發現時延很嚴重,項目要求時延小於300毫秒,通過修改network-caching參數時延可以接受,是否真的小於300毫秒未測試。在開發過程中還遇到了會自動開新窗口顯示視頻的問題(排查後發現是因爲沒有vlc句柄,視頻找不到顯示的地方,所以自己彈窗顯示),通過優化代碼得到解決。現將代碼粘貼如下:
<html>
<head>
<META http-equiv="Content-Language" content="zh-cn">
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<META http-equiv="Pragma" content="no-cache">
<META content="MSHTML 6.00.2800.1106" name="GENERATOR">
<link href="/assets/css/bootstrap.css" rel="stylesheet">
<link href="/assets/css/theme.css" rel="stylesheet">
<link href="/assets/css/font-awesome.min.css" rel="stylesheet">
<script language="javascript" type="text/javascript" src="/js/base64.min.js" ></script>
<script language="javascript" type="text/javascript" src="/js/Common.js" ></script>
<script language="javascript" type="text/javascript" src="/js/PublicModule.js" ></script>
<script type="text/javascript" charset="UTF-8">
function init()
{
if(!initStatus())
return;
var vlc=document.getElementById("vlc");
var options = [":network-caching=300"];
var rtspSource = "rtsp://"+window.location.hostname+"/main";
var itemId = vlc.playlist.add(rtspSource,"",options);
if( itemId != -1 )
{
// play MRL
vlc.playlist.playItem(itemId);
}
else
{
alert("cannot play at the moment !");
}
}
function initStatus()
{
if (!isWindowsPlatform())
return true;
var obj;
var state=false;
// 判斷VLC控件
try {
obj = new ActiveXObject("VideoLAN.VlCPlugin.2");
//var xx = typeof(obj);
if (typeof(obj) != 'undefined')
state = true;
delete obj;
obj = null;
}
catch (e) {obj = null;}
// end 判斷VLC控件
if(!state)
{
document.getElementById("statusctl").style.display = "block";
document.getElementById("player").style.display = "none";
}
return state;
}
function unload(){
obj = document.getElementById("vlc");
if(obj != null){
obj.playlist.stop();
obj.playlist.clear();
delete obj;
obj = null;
}
}
</script>
</head>
<body onUnload="unload();" style="padding:1px;">
<div id="player" style="display:block;">
<object type='application/x-vlc-plugin' id='vlc' classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab" width="1280" height="800">
<param name='mrl' value='' />
<param name='volume' value='50' />
<param name='autoplay' value='true' />
<param name='loop' value='false' />
<param name='fullscreen' value='false' />
<param name="ShowDisplay" value="True" />
<param name="toolbar" value="true"/>
</object>
</div>
<br><br>
<div id="statusctl" style="text-align:center;display:none;">
<a href='/download/vlc-2.2.4-win32.exe'>下載插件</a>
</div>
<!--
<input type="button" value="停止" οnclick="stop();" id="control_button">
-->
<script type="text/javascript" src="/assets/js/jquery.min.js"></script>
<script>
$(document).ready(function(){
init();
})
</script>
</body>
</html>
下面說下自測過程中遇到的問題:
1、播放10多分鐘後vlc和IE會長時間沒反應,只能關閉進程結束。
解決方法:當時使用的是vlc3.0.8版本,換成3.0.10問題依然;改成低版本後解決,實測2.2.1和2.2.4都可以,其它版本未測試。
2、在我自己的電腦上程序運行正常,在別人的電腦上安裝vlc後發現控件出不來。
詳細情況:安裝vlc後IE顯示已加載並啓用了控件(IE對運行activex的相關設置網上有很多,我就不贅述),但程序判斷後顯示控件未安裝。
解決方法:英文版的64位win7應該安裝64位的vlc;中文版的64位win7應該安裝32位的vlc。
附:vlc各版本下載鏈接http://free.nchc.org.tw/vlc/vlc/