我尝试从android/ios设备捕获图像和视频并通过电子邮件发送。我想做一个混合应用程序，所以我使用Phonegap最新版本。我在互联网上搜索，找到了一些代码并将它们排列在一起。现在我希望该用户只能捕获 2 个视频，并且我的代码工作正常。但是现在当我尝试捕获图像时，它不起作用。图像不存储在本地。我还希望该用户只能捕获5张图像，然后单击"发送"按钮时，捕获的图像和视频附加并通过电子邮件发送。这是我的代码，我做了什么
<!DOCTYPE html>
<html>
<head>
<title>Capture Photo</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="emailcomposer.js"></script>
<!-- ********************** -->
<script type="text/javascript" charset="utf-8">
//*********************************
function deviceready() {
alert("Device ready");
destinationType=navigator.camera.DestinationType;
}
var destinationType; // sets the format of returned value
function composeText(){
alert();
var file1 = document.getElementById('vehiclepic1').value;
//var message1 = document.getElementById('message_body').value;
alert(file1);
window.plugins.emailComposer.showEmailComposer(
"Get Estimation",
message1,
["test@mail.com",],
[],
[],
true,
["image.jpeg", "file.zip"]
);
alert('send');
}
function capturePhoto() {
// Take picture using device camera and retrieve image as base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
destinationType: destinationType.DATA_URL });
}
function onPhotoDataSuccess(imageData) {
// Uncomment to view the base64-encoded image data
// alert(imageData);
// Get image handle
//
var i = 0;
if(imageData.length != 0){
i++;
//alert(i++);
var smallImage = document.getElementById('vehiclepic1');
// Unhide image elements
//
smallImage.style.display = 'block';
// Show the captured photo
// The inline CSS rules are used to resize the image
smallImage.src = "data:image/jpeg;base64," + imageData;
}
}
function onFail(message) {
alert('Failed because: ' + message);
}
function callAnotherPage(){
window.location = "test.html";
}
document.addEventListener("deviceready", deviceready, true);
//*********************************
// Called when capture operation is finished
//
function captureSuccess(mediaFiles) {
alert ("success");
alert (mediaFiles.fullPath);
//alert("path : "+mediaFiles.fullPath+", name : "+mediaFiles.name+", type : "+mediaFiles.type+", size : "+mediaFiles.size);
//var i, path,len;
//for (i = 0, len = mediaFiles.length; i < len; i += 1) {
// path = mediaFiles[i].fullPath;
//}
}
// Called if something bad happens.
//
function captureError(error) {
var msg = 'An error occurred during capture: ' + error.code;
navigator.notification.alert(msg, null, 'Uh oh!');
}
// A button will call this function
//
function captureVideo() {
// Launch device video recording application,
// allowing user to capture up to 2 video clips
navigator.device.capture.captureVideo(captureSuccess, captureError, {limit: 2});
}
// Upload files to server
function uploadFile(mediaFile) {
var ft = new FileTransfer(),
path = mediaFile.fullPath,
name = mediaFile.name;
ft.upload(path,
"http://my.domain.com/upload.php",
function(result) {
alert('Upload success: ' + result.responseCode);
alert(result.bytesSent + ' bytes sent');
},
function(error) {
alert('Error uploading file ' + path + ': ' + error.code);
},
{ fileName: name });
}
</script>
<!-- ********************** -->
<script>
var pictureSource; // picture source
var destinationType; // sets the format of returned value
// Wait for Cordova to connect with the device
//
document.addEventListener("deviceready",onDeviceReady,false);
// Cordova is ready to be used!
//
function onDeviceReady() {
pictureSource=navigator.camera.PictureSourceType;
destinationType=navigator.camera.DestinationType;
}
// Called when a photo is successfully retrieved
//
function onPhotoDataSuccess(imageData) {
// Uncomment to view the base64 encoded image data
// alert(imageData);
// Get image handle
//
var smallImage = document.getElementById('smallImage');
// Unhide image elements
//
smallImage.style.display = 'block';
// Show the captured photo
// The inline CSS rules are used to resize the image
//
smallImage.src = "data:image/jpeg;base64," + imageData;
}
// Called when a photo is successfully retrieved
//
function onPhotoURISuccess(imageURI) {
// Uncomment to view the image file URI
// alert(imageURI);
// Get image handle
//
var largeImage = document.getElementById('largeImage');
// Unhide image elements
//
largeImage.style.display = 'block';
// Show the captured photo
// The inline CSS rules are used to resize the image
//
largeImage.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: 50,
destinationType: destinationType.DATA_URL });
}*/
function capturePhoto() {
// Take picture using device camera and retrieve image as base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 25,
destinationType: Camera.DestinationType.FILE_URI, });
}
function onPhotoDataSuccess(imageURI) {
displayPhoto(imageURI);
}
function displayPhoto(imageURI)
{
capturedPhoto ++;
if(capturedPhoto == 1){
var part1 = document.getElementById('part1');
part1.src = imageURI;
}
else if(capturedPhoto == 2){
var part2 = document.getElementById('part2');
part2.src = imageURI;
}
else if(capturedPhoto == 3){
var part3 = document.getElementById('part3');
part3.src = imageURI;
}
else if(capturedPhoto == 4){
var part4 = document.getElementById('part4');
part4.src = imageURI;
}
else if(capturedPhoto == 5){
var part5 = document.getElementById('part5');
part5.src = imageURI;
}
}
// A button will call this function
//
function capturePhotoEdit() {
// Take picture using device camera, allow edit, and retrieve image as base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true,
destinationType: destinationType.DATA_URL });
}
// A button will call this function
//
function getPhoto(source) {
// Retrieve image file location from specified source
navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
destinationType: destinationType.FILE_URI,
sourceType: source });
}
// Called if something bad happens.
//
function onFail(message) {
alert('Failed because: ' + message);
}
</script>
</head>
<body>
<button onclick="captureVideo();">Capture Video</button> <br>
<button onclick="capturePhoto();">Capture Photo</button> <br>
<!-- <button onclick="capturePhotoEdit();">Capture Editable Photo</button> <br> -->
<!-- <button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br> -->
<button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br>
<button onclick="composeText();">Send</button><br>
<img style="display:none;width:60px;height:60px;" id="smallImage" src="" />
<img style="display:none;" id="largeImage" src="" />
<u><b>Pictures</b></u>
<ul>
<li>
<img style="width:100px;height:80px;" id="vehiclepic1" onclick="capturePhoto();" src="" />
</li>
</ul>
</body>
</html>
此代码是否适用于 iOS 设备，或者我必须更改其中的任何内容？
我使用来自Github的EmailComposerWithAttachments插件
如果您使用的是 Cordova 3.0.0 ...您可以使用以下命令在本地安装此插件（https://github.com/steve-jansen/cordova-ios-emailcomposer）
科尔多瓦插件使用 http://plugins.cordova.io 注册表添加电子邮件作曲家 #
add the path of your image in the body as below code
var emailComposer = cordova.require('emailcomposer.EmailComposer');
emailComposer.show({
to: toemail,
subject: emailsubject,
body: '<p> '+body+'</p><img alt="Embedded Image" height="200" width="200" src="'+path+'" />',
isHtml: true,
});
图像路径取自此函数
function sendEmail(imageData) {
var largeImage = document.getElementById('largeImage');
largeImage.style.display = 'block';
largeImage.src = "data:image/jpeg;base64," + imageData;
path = "data:image/jpeg;base64," + imageData; // this variable I used in body of email
var cc = Ext.ComponentQuery.query('camerashare');
cc[0].items.getByKey('ttbar').show();
}