目 錄
(一) 控件總體功能說明.. 2
(二) 控件集成使用說明.. 2
(三) 控件方法說明.. 4
3.1 啟動視頻捕捉.. 4
3.2 抓拍攝像頭視頻畫面.. 4
3.3 讀取抓拍的畫面結果數據.. 4
3.3.1 按照jpg格式讀取結果數據.. 4
3.3.2 按照bmp格式讀取結果數據.. 4
(四) 控件屬性及方法表格.. 5
(五)、常見問題.. 7
5.1 控件如何升級到新版本?.. 7
5.2 如何驗證控件是否注冊成功成為正式版本?.. 7
5.3 高清攝像頭拍照結果上傳失敗的情況如何解決?.. 8
5.4 瀏覽器假死情況如何解決?.. 8
(一) 控件總體功能說明
攝像頭視頻采集控件用於在Web編程中輔助您完成攝像頭圖像采集功能,控件基於微軟DirectX技術,支持幾乎所有的USB外置攝像頭及內置攝像頭,通過在Web項目中引用該控件,可以簡化您的攝像頭圖像采集過程,加快您的項目開發進度。
攝像頭圖像采集控件(以下簡稱控件)工作在客戶端瀏覽器中,支持多種服務器端編程技術及部署環境,支持asp、jsp、php、asp.net等常見的服務器端編程技術,圖像采集結果支持按照多種圖像數據保存及導出使用。
控件內置圖像裁剪編輯功能,便於您選取有意義的圖像處理使用,控件支持圖像旋轉、客戶端本地保存等功能。
(二) 控件集成使用說明
控件以cab壓縮包格式發行,在項目中集成控件時需要復制ImageCapOnWeb.cab文件到項目中,然后在需要進行圖像采集的頁面中使用<object></object>的方式引入該控件。完整的引用控件的示例如下:
<object classid="clsid:34681DB3-58E6-4512-86F2-9477F1A9F3D8"
id="cap1" codebase="./cabs/ImageCapOnWeb.cab#version=2,0,0,0" width="100%" height="500">
<param name="Visible" value="0">
<param name="AutoScroll" value="0">
<param name="AutoSize" value="0">
<param name="AxBorderStyle" value="1">
<param name="Caption" value="WebVideoCap">
<param name="Color" value="4278190095">
<param name="Font" value="宋體">
<param name="KeyPreview" value="0">
<param name="PixelsPerInch" value="96">
<param name="PrintScale" value="1">
<param name="Scaled" value="-1">
<param name="DropTarget" value="0">
<param name="HelpFile" value>
<param name="PopupMode" value="0">
<param name="ScreenSnap" value="0">
<param name="SnapBuffer" value="10">
<param name="DockSite" value="0">
<param name="DoubleBuffered" value="0">
<param name="ParentDoubleBuffered" value="0">
<param name="UseDockManager" value="0">
<param name="Enabled" value="-1">
<param name="AlignWithMargins" value="0">
<param name="ParentCustomHint" value="-1">
<param name="key1" value="">
<param name="key2" value="">
</object>
上面的示例演示了如何在項目的頁面中引用控件,注意紅色標示的部分用於確定控件cab壓縮包所在路徑,要結合項目中的目錄划分自行制定到控件壓縮包的路徑。
除了要在html頁面中引入控件以外,客戶端瀏覽器在訪問控件所在頁面時,需要提前調整瀏覽器設定,需要啟用 ActiveX技術,因為控件未進行數字簽名,因此需要啟用瀏覽器的“未簽名 ActiveX下載提示”功能。
如果需要上傳控件的拍照結果,還需要額外編程讀取拍照以后控件的數據值屬性,取到經過base64格式編碼的數據以后提交到服務器端解碼並保存。
(三) 控件方法說明
3.1 啟動視頻捕捉
控件名稱.start();
start()方法用於啟動攝像頭進行視頻畫面呈現,注意攝像頭為獨占性應用,即在同一時刻最多只有一個程序可以取得攝像頭數據,因此在調試程序請先確保無其它程序或軟件在讀取攝像頭數據。
3.2 抓拍攝像頭視頻畫面
控件名稱.cap();
Cap方法用於抓拍當前攝像頭圖像數據,抓拍結果保存到結果編輯窗口中。
3.3 讀取抓拍的畫面結果數據
3.3.1 按照jpg格式讀取結果數據
控件名稱. jpegBase64Data
通過讀取控件的jpegBase64Data屬性,可以取得抓拍結果圖像的jpg格式結果數據經過base64編碼格式轉換的字符串數據,為了便於在web編程中傳輸數據內容,得到的圖像數據是按照base64格式編碼的字符串數據,使用前注意需要進行解碼處理。
3.3.2 按照bmp格式讀取結果數據
控件名稱. bmpBase64Data
通過讀取控件的bmpBase64Data屬性,可以取得拍照結果的bmp格式數據經過base64編碼處理后的字符串數據。可以用來上傳到服務器端等情景下使用,但是注意bmp格式壓縮比較jpg格式差很多,所以在需要上傳的情況下應該盡量使用jpg格式的數據。
(四) 控件屬性及方法表格
分類 |
名稱 |
說明 |
控件方法 |
start() |
開始取得攝像頭畫面數據並顯示在控件中。 |
控件方法 |
cap() |
拍照並停止攝像頭動態畫面捕捉 |
控件方法 |
stop() |
停止動態畫面捕捉,當調用cap()方法以后會自動調用stop()方法。 |
控件方法 |
clear() |
清除拍照結果。 |
控件方法 |
startWith(int index) |
當計算機連接了多個攝像頭時可以使用這個方法來啟動指定的攝像頭。例如啟動第二個攝像頭為控件名稱.startWith(1);//注意第一個攝像頭從0開始編號 |
控件方法 |
resizePicture(width,height) |
調整輸出圖像尺寸,例如需要調整輸出圖像尺寸為1024X768像素時可以使用 控件名稱.resizePicture(1024,768); |
控件方法 |
AboutBox() |
顯示控件關於對話框,可以查看控件當前工作狀態,例如查看是否工作在正式授權模式下。 |
控件方法 |
savetoFile(filename) |
保存拍照結果到客戶端計算機本地硬盤中,例如 控件名稱.saveToFile(‘d://test.jpg’); |
控件方法 |
switchWatchOnly() |
切換到隱藏編輯按鈕的方式,只顯示視頻窗口。 |
控件方法 |
switchFullMode() |
切換到控件缺省默認顯示方式,顯示控制按鈕及編輯按鈕等。 |
控件方法 |
drawText2Footer(text) |
在圖片上繪制一段文字信息,注意繪制位置是固定的。 |
控件方法 |
drawTextInfo(x,y,fontsize, r,g,b,msg) |
在圖片上繪制一段文字信息,參數x,y用於確定在那個位置開始繪制文字信息,坐標位置為從空間左上角為0,0坐標開始計算。Fontsize為字體大小,例如指定使用12號字體時傳遞參數值為12即可。r,g,b為繪制文字的紅、綠、藍三原色值,例如要繪制的文字為紅色時可以指定r,g,b值為255,0,0即可。msg為要繪制的文字信息內容。 |
控件方法 |
getCamName(int idx) |
讀取某一個攝像頭設備的名稱,通過讀取控件的camCount屬性可以取得客戶端本機一共連接了多少個攝像頭,然后可以遍歷讀取所有的攝像頭設備名稱。 |
控件方法 |
getFormatName (int idx) |
讀取當前選中的攝像頭支持的視頻格式名稱,可以通過先讀取控件的formatCount屬性取得當前攝像頭支持的格式總數,然后遍歷讀取所有的視頻規格名稱。 |
控件方法 |
setCurrentCam(int idx) |
設置控件當前使用哪一個攝像頭,第一個攝像頭從0開始編號。 |
控件方法 |
setCurrentFormat (int idx) |
設置控件工作在某一中視頻規格下,例如先通過讀取formatCount取得支持的視頻規格總數,然后通過getFormatName取得每一個規格的名稱,然后再設置當前選中的視頻規格。 |
控件屬性 |
Key1,key2,licenseMode |
用於向控件提供授權碼,key1和key2分別對應作者提供的key值,licenseMode值為授權工作模式。授權碼需要聯系控件作者付費后取得,作者郵件 peihexian@qq.com |
控件屬性 |
jpegBase64Data |
用於取得jpeg格式的圖像base64編碼數據,jpeg格式數據量比bmp小巧很多,建議讀取控件的此屬相取得圖像數據使用。 |
控件屬性 |
bmpBase64Data |
用於取得bmp格式的圖像base64編碼數據,bmp格式數據量大,不建議使用。 |
控件屬性 |
camCount |
用於取得客戶端本機連接了多少個攝像頭設備。 |
控件屬性 |
formatCount |
用於取得客戶端當前選中攝像頭支持的視頻格式總數。 |
(五)、常見問題
5.1 控件如何升級到新版本?
控件被客戶端IE瀏覽器加載以后會在c:\windows\system32\目錄中生成一個ImageCapOnWeb.ocx文件,如果有新版本控件發布時,可以手動的刪除system32目錄中的ImageCapOnWeb.ocx文件以便瀏覽器再次重新下載新版本控件。
5.2 如何驗證控件是否注冊成功成為正式版本?
在聯系控件作者購買授權碼以后,配置控件的key1,key2,licenseMode這三個屬性值,注意需要在每一個引用控件的頁面中都要配置這三個屬性,如果擔心配置的參數值不正確而造成注冊失敗,可以調用控件的AboutBox()方法來驗證控件工作模式。
示例:document.getElementById('cap1').AboutBox();
5.3 高清攝像頭拍照結果上傳失敗的情況如何解決?
在個別web服務器上限制了客戶端發送的http請求數據量大小,例如tomcat缺省限制客戶端最大發送2M的http post數據(文件上傳除外),我們取得的照片base64字符串數據在高清攝像頭時有可能會很大,因此需要調整web服務器的參數來接受比較大的http post數據,不同的web服務器配置參數各不相同,請參考服務器手冊調整參數。
5.4 瀏覽器假死情況如何解決?
個別的客戶端計算機在使用控件后如果出現瀏覽器假死情況,從以下幾個角度解決:
1.關閉應用程序保護(DEP),方法為:右鍵點擊“我的電腦”->“屬性”->“高級系統設置”->“高級”->“設置”->”數據執行保護”,選擇“僅為基本windows程序和服務啟用DEP(T)”
2.清除一下瀏覽器中的惡意網址插件等垃圾插件。