之前做了一起關於海康威視視頻插件二次開發的經驗總結，正好公司在監控頁面上加了新的需求，要求添加大華視頻插件方法，經過一番奮戰后，總算完整解決了大華插件中的一些問題。那么這次就來談談大華視頻插件二次開發中的一些東西。
在正式開始之前，得先說一句，開發大華插件中遇到的最大問題不是代碼上的問題而是插件版本過多，算上公司找官方提供的二次開發包加上我自己在網上搜羅的一些總共有五六種不同的開發包，甚至網上流傳的可能有更多，不同的開發包使用着不同的插件及文檔，在提供的方法上也有很多的不同，因此在開發對應的需求上就相應地遇到了很多困難，就比如插件中獲取通道列表這個方法在我獲得的好幾個版本的開發包的文檔中就沒有提供相應的方法，直到最后一次於大華公司研發的負責人交流才拿到相對全面的最新開發包，這才解決了對大華視頻插件開發的首要問題。
環境與設備支持
首先放一下我獲取到的相對來說較為全面的大華視頻開發包連接：https://pan.baidu.com/s/1CPA-wm0WBmb2WDYHaSNdJw
密碼：ix41
與海康威視視頻插件的文檔不同，大華插件提供的二次開發文檔中並沒有關於插件運行環境方面相關的內容，但根據本人實測目前高版本的Firefox和Chrome是不能支持該插件的，因此對於該插件的使用可以對比海康插件，大華插件除了沒有瀏覽器位數的限制，其他的就對照海康控件的來，選用低版本的瀏覽器或者直接使用IE瀏覽器。
demo
快速二次開發
首先是test.html
1 <!doctype html> 2 <html> 3 <head> 4 <title></title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <meta http-equiv="Pragma" content="no-cache" /> 7 <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" /> 8 <meta http-equiv="Expires" content="0" /> 9 <script> 10 document.write("<link type='text/css' href='../css/demo.css?version=" + new Date().getTime() + "' rel='stylesheet' />"); 11 </script> 12 </head> 13 <body> 14 <div id="divPlugin" class="plugin"></div> 15 </body> 16 <script src="../lib/jquery-1.7.1.min.js"></script> 17 <script src="../module/foundation.js"></script> 18 <script src="../module/WebVideoCtrl.js"></script> 19 <script src="test.js"></script> 20 </html>
在這里需要說明一點的是，大華視頻提供插件的方法相對海康提供的方法來說是更加簡潔的，但是與之相對的，對於錯誤信息的提示並沒有如海康一樣通過回調方法中的error參數給出,而是一股腦的將其塞到日志文件中去，該日志可以在C:\Program Files (x86)\webrec\WEB30\WebPlugin目錄下的log和sdk_log文件夾下找到，但是在文檔中對日志信息也沒有什么解釋，對於不理解它的日志信息的人來說，處理報錯可能是一種困難，需要咨詢官方人士。
test.js
1 $(function() { 2 initialValue = new Object(); 3 initialValue.g_iWndIndex = 0; 4 initialValue.szDeviceIdentify = ''; 5 initialValue.deviceport = ''; 6 initialValue.rtspport = ''; 7 initialValue.channels = []; 8 initialValue.ip = ''; 9 initialValue.port = ''; 10 initialValue.username = ''; 11 initialValue.password = ''; 12 dh_initPlugin(); 13 dh_login(initialValue); 14 }) 15 //初始化 16 function dh_initPlugin(){ 17 WebVideoCtrl.insertPluginObject("divPlugin", 1300, 800); 18 WebVideoCtrl.initPlugin(); 19 //設置窗口分割數 20 WebVideoCtrl.setSplitNum(1); 21 //設置雙擊可全屏功能 22 WebVideoCtrl.enablePreviewDBClickFullSreen(true); 23 } 24 function dh_login(initialValue){ 25 if ("" == initialValue.ip || "" == initialValue.port) { 26 return; 27 } 28 initialValue.szDeviceIdentify = initialValue.ip + "_" + initialValue.port; 29 szDeviceIdentifyFlag = initialValue.szDeviceIdentify; 30 var port = parseInt(initialValue.port); 31 var ret = WebVideoCtrl.login(initialValue.ip, port, initialValue.username, initialValue.password, 0); 32 if (ret != 0) { 33 alert("登錄失敗："+ret); 34 return; 35 } 36 /** 該方法用於獲取NVR下的通道列表 37 var channelRet = WebVideoCtrl.getAllChannelInfo(); 38 var arr = []; 39 for (var i = 0; i < channelRet.length; i++) { 40 var channelInfo = channelRet[i]; 41 var channelMsg = { 42 "id": channelInfo.Channel, 43 "title": channelInfo.ChannelName, 44 "ipaddress": initialValue.szDeviceIdentify, 45 "brandNum": brandFlag, 46 "initialValue": initialValue, 47 } 48 arr.push(channelMsg); 49 }*/ 50 dh_startRealPlay(); 51 } 52 function dh_startRealPlay(){ 53 /** 54 * 參數依次分別為通道號，碼流，窗口數 55 */ 56 WebVideoCtrl.connectRealVideoEx(1, 1, 0); 57 }
經驗總結及部分錯誤展示
-
控制台報錯：
原因及解決方法：發生此問題的原因是由於，foundation.js沒有導入或者導入時放在了WebVideoCtrl.js的下面，頁面加載js文件時會先從上層加載到下層，這樣在WebVideoCtrl用到的foundation.js的方法就無法加載進來。將其放到WebVideoCtrl.js的上面導入即可。
- 控制台報錯：
原因及解決方法：發生這問題時，本人還着實困擾了一下，這問題在IE上面不出現，而在較低版本的Firefox和Chrome上有，百度報錯信息也盡是一些毫不相干的內榮，最后仔細查看發現是在登錄時傳參時參數類型出了問題，需要注意在WebVideoCtrl.js中參數的說明，以字母i開頭的參數說明是純數字，以s開頭的參數說明是字符串，切勿傳參時，類型弄錯。
- 日志報錯：
原因及解決方法:這個報錯信息是插件未登錄，登錄就行。
- 此外，如果將大華插件和海康插件方法放在一個頁面使用的話需要注意，他們的插件方法的對象名是相同的，想要使用的話需要更改其中一個的對象名稱。