Cordova 媒體捕獲

此插件用于訪問設(shè)備的捕獲選項。

步驟1 - 安裝媒體捕獲插件

要安裝此插件，我們將打開命令提示符并運行以下代碼 -

C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-media-capture

步驟2 - 添加按鈕

由于我們希望向您展示如何捕獲音頻，圖片和視頻，因此我們將在 index.html 中創(chuàng)建三個按鈕。

<button id = "audioCapture">AUDIO</button>
<button id = "imageCapture">IMAGE</button>
<button id = "videoCapture">VIDEO</button>

步驟3 - 添加事件監(jiān)聽器

下一步是在 index.js 中的 onDeviceReady 內(nèi)添加事件監(jiān)聽器。

document.getElementById("audioCapture").addEventListener("click", audioCapture);
document.getElementById("imageCapture").addEventListener("click", imageCapture);
document.getElementById("videoCapture").addEventListener("click", videoCapture);

步驟4A - 捕獲音頻功能

index.js 中的第一個回調(diào)函數(shù)是 audioCapture 。 要啟動錄音機(jī)，我們將使用 captureAudio 方法。 我們使用兩個選項 - limit 將允許每次捕獲操作只記錄一個音頻剪輯， duration 是聲音片段的秒數(shù)。

function audioCapture() {

   var options = {
      limit: 1,
      duration: 10
   };

   navigator.device.capture.captureAudio(onSuccess, onError, options);

   function onSuccess(mediaFiles) {
      var i, path, len;
		
      for (i = 0, len = mediaFiles.length; i < len; i += 1) {
         path = mediaFiles[i].fullPath;
         console.log(mediaFiles);
      }
   }

   function onError(error) {
      navigator.notification.alert('Error code: ' + error.code, null, 'Capture Error');
   }
	
}

當(dāng)按下 AUDIO 按鈕時，錄音機(jī)將打開。

控制臺將顯示用戶捕獲的對象的返回數(shù)組。

步驟4B - 捕獲圖像功能

捕獲圖像的功能將與最后一個相同。 唯一的區(qū)別是我們這次使用 captureImage 方法。

function imageCapture() {

   var options = {
      limit: 1
   };

   navigator.device.capture.captureImage(onSuccess, onError, options);

   function onSuccess(mediaFiles) {
      var i, path, len;
		
      for (i = 0, len = mediaFiles.length; i < len; i += 1) {
         path = mediaFiles[i].fullPath;
         console.log(mediaFiles);
      }
   }

   function onError(error) {
      navigator.notification.alert('Error code: ' + error.code, null, 'Capture Error');
   }
	
}

現(xiàn)在我們可以點擊 IMAGE 按鈕啟動相機(jī)。

當(dāng)我們拍照時，控制臺將使用image對象記錄數(shù)組。

步驟4C - 捕獲視頻功能

讓我們重復(fù)相同的概念來捕獲視頻。我們將使用 videoCapture 方法。

function videoCapture() {

   var options = {
      limit: 1,
      duration: 10
   };

   navigator.device.capture.captureVideo(onSuccess, onError, options);

   function onSuccess(mediaFiles) {
      var i, path, len;
		
      for (i = 0, len = mediaFiles.length; i < len; i += 1) {
         path = mediaFiles[i].fullPath;
         console.log(mediaFiles);
      }
   }

   function onError(error) {
      navigator.notification.alert('Error code: ' + error.code, null, 'Capture Error');
   }
	
}

如果按 VIDEO 按鈕，相機(jī)將打開，我們可以錄制視頻。

保存視頻后，控制臺將再次返回數(shù)組。這個時候跟視頻對象里面。