Cordova入門系列（三）Cordova插件調用
版權聲明：本文為博主原創文章，轉載請注明出處
?
?
上一章我們介紹了cordova android項目是如何運行的，這一章我們介紹cordova的核心內容，插件的調用。演示一個例子，通過cordova插件，去調用攝像頭。
?
一、插件的安裝以及基本信息：
我們先在項目中安裝調用攝像頭的插件cordova-plugin-camera，cd到hello下，執行：
cordova plugin add cordova-plugin-camera
然后它會為我們的hello/plugins文件夾下添加cordova-plugin-camera插件（這個是整個這個插件模塊，可用于安卓和ios。卸載插件用cordova plugin remove?cordova-plugin-camera）；
同時也會在我們的platforms/android/platform_www/plugins下面添加對應的安卓的插件cordova-plugin-camera（這個是根據對應的平臺生成的對應的插件內容，只可用于本安卓平臺）；
也會在我們的資源文件夾assets/www/plugins下添加cordova-plugin-camera插件（這個資源文件夾下的所有的文件，才是真正的app運行的時候調用的，加載的文件）；
還會為我們的src下添加org.apache.cordova.camera包以及對應的java文件。
為什么要在項目中加這么多，這只是cordova的機制，我們不作重點研究。這三個目錄是有不同的作用的，但我們只重點關注assets/www目錄下。
?
除了上面這些，加完這個插件也會改變一些其他文件的內容，首先看res/xml/config.xml，最后多了一項配置信息：
<feature name="Camera"><param name="android-package" value="org.apache.cordova.camera.CameraLauncher" /> </feature>
feature · name："js中間件通過它調用java方法"。
（中間件就是我們的插件對應的一些js文件。我們寫的js程序通過這些插件（中間件）去調用Jjava原生內容）
param · name："android-package" ? ? value：原生插件類的包類路徑。
打開assets/www下cordova_plugins.js，發現其中也增加了很多內容：
cordova.define('cordova/plugin_list', function(require, exports, module) {
module.exports = [{"id": "cordova-plugin-camera.Camera","file": "plugins/cordova-plugin-camera/www/CameraConstants.js","pluginId": "cordova-plugin-camera","clobbers": ["Camera"]},{"id": "cordova-plugin-camera.CameraPopoverOptions","file": "plugins/cordova-plugin-camera/www/CameraPopoverOptions.js","pluginId": "cordova-plugin-camera","clobbers": ["CameraPopoverOptions"]},{"id": "cordova-plugin-camera.camera","file": "plugins/cordova-plugin-camera/www/Camera.js","pluginId": "cordova-plugin-camera","clobbers": ["navigator.camera"]},{"id": "cordova-plugin-camera.CameraPopoverHandle","file": "plugins/cordova-plugin-camera/www/CameraPopoverHandle.js","pluginId": "cordova-plugin-camera","clobbers": ["CameraPopoverHandle"]}
];
module.exports.metadata =
// TOP OF METADATA
{"cordova-plugin-whitelist": "1.3.0","cordova-plugin-compat": "1.0.0","cordova-plugin-camera": "2.3.0"
};
// BOTTOM OF METADATA
}); id:插件中某個模塊或具體功能的id
file:這個id對應的js文件（實現這個模塊或功能的文件）
pluginId:插件的ID，通過這個ID可以進行插件的安裝和卸載
clobbers:H5或js通過它去調用js中間件（插件）中定義的方法
?
二、在代碼中如何調用攝像頭插件
上面我們說的都是在執行了cordova plugin add cordova-plugin-camera，安裝好插件之后所產生的內容以及插件的一些基本信息，配置信息。接下來我們說一下如何簡單使用這個插件。
首先我們修改index.html（指的assets/www下的）
<!DOCTYPE html> <html><head><meta name="format-detection" content="telephone=no"><meta name="msapplication-tap-highlight" content="no"><meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"><link rel="stylesheet" type="text/css" href="css/index.css"><title>Hello World</title></head><body><div class="app"><!-- 這里添加一個button去調用自己寫的拍照函數 --><button onClick="takePhoto()">拍照</button></div><script type="text/javascript" src="cordova.js"></script><script type="text/javascript" src="js/index.js"></script></body> </html>
接下來再修改index.js
//自己定義的拍照函數
function takePhoto() {//拍照//navigator.camera就是上面我們所說的clobbers定義的東西，用來調用插件中的方法的//getPicture就是插件中調用攝像頭拍照的方法navigator.camera.getPicture(takeSuccess, takeFail, {destinationType : Camera.DestinationType.FILE_URI});//拍照成功后回調function takeSuccess(imageURI) {console.log('success' + imageURI);}//失敗后回調function takeFail(message) {navigator.notification.alert("拍照失敗，原因：" + message);}
} 至此，我們的Cordova攝像頭插件已經在代碼中調用好了，運行我們的項目，就可以拍照了。（當然，模擬器上是不行的，得用真機）
?
三、getPicture()方法詳解：
camera.getPicture(cameraSuccess, cameraError, cameraOptions)
選擇使用攝像頭拍照，或從設備相冊中獲取一張照片。圖片以base64編碼的字符串或圖片URI形式返回。返回值會按照用戶通過cameraOptions參數所設定的下列格式之一發送給cameraSuccess回調函數：
1.一個字符串，包含Base64編碼的照片圖像（默認情況）。
2.一個字符串，表示在本地存儲的圖像文件位置。
?
cameraSuccess：
提供圖像數據的onSuccess回調函數。
function(imageData) {// 對圖像進行處理
} 參數imageData：根據cameraOptions的設定值，為Base64編碼的圖像數據或圖像文件的URI。（字符串類型）
?
errorCallback:
提供錯誤信息的onError回調函數。
function(message) {// 顯示有用信息
} 參數：message：設備本地代碼提供的錯誤信息。（字符串類型）
?
cameraOptions：
定制攝像頭設置的可選參數。
{ quality : 75,destinationType : Camera.DestinationType.DATA_URL,sourceType : Camera.PictureSourceType.CAMERA,allowEdit : true,encodingType : Camera.EncodingType.JPEG,targetWidth : 100,targetHeight : 100
}; quality：存儲圖像的質量，范圍是[0,100]。（數字類型）
destinationType：選擇返回數據的格式。通過navigator.camera.DestinationType進行定義。（數字類型）
備注：強烈建議將“Camera.destinationType”設為FILE_URI。
sourceType：設定圖片來源。通過nagivator.camera.PictureSourceType進行定義。（數字類型）
allowEdit：在選擇圖片進行操作之前允許對其進行簡單編輯。（布爾類型）
EncodingType：選擇返回圖像文件的編碼方式，通過navigator.camera.EncodingType進行定義。（數字類型）
targetWidth：以像素為單位的圖像縮放寬度，必須和targetHeight同時使用。相應的寬高比保持不變。（數字類型）
targetHeight：以像素為單位的圖像縮放高度，必須和targetWidth同時使用。相應的寬高比保持不變。（數字類型）
MediaType：設置選擇圖片的類型，只有當PictureSourceType is PHOTOLIBRARY or SAVEDPHOTOALBUM時才會生效，該參數由nagivator.camera.MediaType (數字類型)定義。
qbxt2019.05 總結2 - 數位DP)
