Android Phonegap Camera And Image Uploading
I have been trying to make this work, searched google and here since Friday. My ultimate goal is to be able take multiple pictures with a title and description for each and upload
Solution 1:
According to this answer: Phonegap android unable to upload image using fileTransfer You cannot use the URI directly....
But, it seems the uri can be used directly... (see my code below)
Edit 25-7-2013 I got this working with: call like this:
navigator.camera.getPicture(onPhotoUriSuccess,onFailCamera, { quality:50,
destinationType:pictDestinationType.FILE_URI });
and on succes:
function onPhotoUriSuccess(imageUriToUpload){
var url=encodeURI("http://your_url_for_the_post/");
var username='your_user';
var password='your_pwd';
varparams = new Object();
params.your_param_name = "something"; //you can send additional info with the filevar options = new FileUploadOptions();
options.fileKey = "the_name_of_the_image_field"; //depends on the api
options.fileName = imageUriToUpload.substr(imageUriToUpload.lastIndexOf('/')+1);
options.mimeType = "image/jpeg";
options.params = params;
options.chunkedMode = true; //this is important to send both data and filesvar headers={'Authorization':"Basic " + Base64.encode(username + ":" + password)};
options.headers = headers;
var ft = new FileTransfer();
ft.upload(imageUriToUpload, url, succesFileTransfer, errorFileTransfer, options);
}
By the way, I use an apache webserver on the api site, I saw here, nginx could have a problem with the chunked mode: PhoneGap chunckedMode true upload error
Solution 2:
<!DOCTYPE html><html><head><title>Capture Audio,Image,Video</title><scripttype="text/javascript"charset="utf-8"src="cordova-1.9.0.js"></script><scripttype="text/javascript"charset="utf-8"src="json2.js"></script><scripttype="text/javascript"charset="utf-8">// Called when capture operation is finished//functioncaptureSuccess(mediaFiles) {
var i, len;
for (i = 0, len = mediaFiles.length; i < len; i += 1) {
uploadFile(mediaFiles[i]);
}
}
functioncaptureSuccess2(mediaFiles) {
var i, len;
for (i = 0, len = mediaFiles.length; i < len; i += 1) {
uploadFile2(mediaFiles[i]);
}
}
functioncaptureSuccess3(mediaFiles) {
var i, len;
for (i = 0, len = mediaFiles.length; i < len; i += 1) {
uploadFile3(mediaFiles[i]);
}
}
// Called if something bad happens.//functioncaptureError(error) {
var msg = "An error occurred during capture: " + error.code;
navigator.notification.alert(msg, null, "Uh oh!");
}
functioncaptureError2(error) {
var msg = "An error occurred during capture: " + error.code;
navigator.notification.alert(msg, null, "Uh oh!");
}
functioncaptureError3(error) {
var msg = "An error occurred during capture: " + error.code;
navigator.notification.alert(msg, null, "Uh oh!");
}
// A button will call this function//functioncaptureAudio() {
// Launch device audio recording application,// allowing user to capture up to 2 audio clips
navigator.device.capture.captureAudio(captureSuccess, captureError, {limit: 2});
}
functioncaptureImage()
{
// Launch device camera application,// allowing user to capture up to 2 images
navigator.device.capture.captureImage(captureSuccess2, captureError2, {limit: 2});
}
functioncaptureVideo() {
// Launch device video recording application,// allowing user to capture up to 2 video clips
navigator.device.capture.captureVideo(captureSuccess3, captureError3, {limit: 2});
}
// Upload files to serverfunctionuploadFile(mediaFile) {
var win = function (r) {
alert("Code = " + r.responseCode);
alert("Bytes Sent = " + r.bytesSent);
alert("Audio Uploaded");
}
var fail = function (error) {
alert("An error has occurred: Code = " + error.code);
alert("upload error source " + error.source);
alert("upload error target " + error.target);
}
var options = newFileUploadOptions();
//options.fileKey = mediafile.file;
options.fileName = mediaFile.file;
options.mimeType = "audio/wav";
fileURL=mediaFile.fullPath;
var ft = newFileTransfer();
ft.upload(fileURL, encodeURI("http://192.168.1.101:80/myfile.php"), win, fail,
options);
}
functionuploadFile2(mediaFile) {
var win = function (r) {
alert("Code = " + r.responseCode);
alert("Bytes Sent = " + r.bytesSent);
alert("Image Uploaded");
}
var fail = function (error) {
alert("An error has occurred: Code = " + error.code);
alert("upload error source " + error.source);
alert("upload error target " + error.target);
}
var options = newFileUploadOptions();
//options.fileKey = mediafile.file;
options.fileName = mediaFile.file;
options.mimeType = "text/plain";
ImageURL=mediaFile.fullPath;
var ft = newFileTransfer();
ft.upload(ImageURL, encodeURI("http://192.168.1.101:80/myfile.php"), win, fail,
options);
}
functionuploadFile3(mediaFile) {
var win = function (r) {
alert("Code = " + r.responseCode);
alert("Bytes Sent = " + r.bytesSent);
alert("Video Uploaded");
}
var fail = function (error) {
alert("An error has occurred: Code = " + error.code);
alert("upload error source " + error.source);
alert("upload error target " + error.target);
}
var options = newFileUploadOptions();
//options.fileKey = mediafile.file;
options.fileName = mediaFile.file;
options.mimeType = "video/mpeg";
VideoURL=mediaFile.fullPath;
var ft = newFileTransfer();
ft.upload(VideoURL, encodeURI("http://192.168.1.101:80/myfile.php"), win, fail,
options);
}
</script></head><body><center><h1>MCA3B Capture Session</h1></center><br><br><center><buttononclick="captureAudio();">Capture Audio</button><br><br><buttononclick="captureImage();">Capture Image</button><br><br><buttononclick="captureVideo();">Capture Video</button><br></center></body></html>
Above is the code for capturing image,audio and video and upload it on local server.
Post a Comment for "Android Phonegap Camera And Image Uploading"