可以使用 phonegap 获取照片库内容
Posted
技术标签:
【中文标题】可以使用 phonegap 获取照片库内容【英文标题】：it possible getting photo library content with phonegap 【发布时间】：2015-04-21 17:12:08 【问题描述】：我想使用 Phonegap/cordova 获取设备的库照片，以便在我的应用程序库中显示它们。 不通过camera.getPicture可以访问吗？ 我确实想过使用 phonegap 的 FileSystem API，但他们没有帮助我。
【问题讨论】：
【参考方案1】：你可以使用camera cordova插件。
https://github.com/apache/cordova-plugin-camera
示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta content="telephone=no" name="format-detection">
<!-- WARNING: for ios 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta content=
"user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi"
name="viewport">
<script src="cordova.js" type="text/javascript"></script>
<script src="js/index.js" type="text/javascript"></script>
<title>Camera Cordova Plugin</title>
</head>
<body>
<button onclick="capturePhoto();">Capture Photo</button><br>
<button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo
Library</button><br>
<img id="image" src="" style="display:none;width:100%;">
</body>
</html>
javascript
var pictureSource; // picture source
var destinationType; // sets the format of returned value
// Wait for device API libraries to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// device APIs are available
//
function onDeviceReady()
pictureSource = navigator.camera.PictureSourceType;
destinationType = navigator.camera.DestinationType;
// Called when a photo is successfully retrieved
//
function onPhotoDataSuccess(imageURI)
// Uncomment to view the base64-encoded image data
console.log(imageURI);
// Get image handle
//
var cameraImage = document.getElementById('image');
// Unhide image elements
//
cameraImage.style.display = 'block';
// Show the captured photo
// The inline CSS rules are used to resize the image
//
cameraImage.src = imageURI;
// Called when a photo is successfully retrieved
//
function onPhotoURISuccess(imageURI)
// Uncomment to view the image file URI
console.log(imageURI);
// Get image handle
//
var galleryImage = document.getElementById('image');
// Unhide image elements
//
galleryImage.style.display = 'block';
// Show the captured photo
// The inline CSS rules are used to resize the image
//
galleryImage.src = imageURI;
// A button will call this function
//
function capturePhoto()
// Take picture using device camera and retrieve image as base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail,
quality: 30,
targetWidth: 600,
targetHeight: 600,
destinationType: destinationType.FILE_URI,
saveToPhotoAlbum: true
);
// A button will call this function
//
function getPhoto(source)
// Retrieve image file location from specified source
navigator.camera.getPicture(onPhotoURISuccess, onFail,
quality: 30,
targetWidth: 600,
targetHeight: 600,
destinationType: destinationType.FILE_URI,
sourceType: source
);
// Called if something bad happens.
//
function onFail(message)
//alert('Failed because: ' + message);
参考：
http://blog.revivalx.com/2014/05/03/tutorial-camera-cordova-plugin-for-ios-and-android/
【讨论】：
【参考方案2】：我正在开发cordova-plugin-photo-library 插件，它提供了跨平台的方式来枚举设备上的所有照片。
用法：
cordova.plugins.photoLibrary.getLibrary(function (library)
// Here we have the library as array
cordova.plugins.photoLibrary.getThumbnailUrl(library[0],
function (thumbnailUrl) image.src = thumbnailUrl; ,
function (err) console.log('Error occured'); ,
thumbnailWidth: 512,
thumbnailHeight: 384,
quality: 0.8
);
);【讨论】：
以上是关于可以使用 phonegap 获取照片库内容的主要内容，如果未能解决你的问题，请参考以下文章