Uploading Picture From Phonegap Cordova App
Trying to get photo to upload but can't get the file data to the server. The app brings up the camera and does a POST to the server but there is never any file uploaded. I've crea
Solution 1:
Take a look my sample here, I hope it helps.
html
<!DOCTYPE html><html><head><metacharset="utf-8"><metacontent="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 –>
<metacontent=
"user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi"name="viewport"><scriptsrc="cordova.js"type="text/javascript"></script><scriptsrc="js/index.js"type="text/javascript"></script><title>Camera Cordova Plugin</title></head><body><buttononclick="capturePhoto();">Capture Photo</button><br><buttononclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo
Library</button><br><imgid="image"src=""style="display:none;width:100%;"><buttononclick="upload();">Upload</button></body></html>js
functionupload() {
var img = document.getElementById('image');
var imageURI = img.src;
var options = newFileUploadOptions();
options.fileKey = "file";
options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1);
options.mimeType = "image/jpeg";
var params = newObject();
options.params = params;
options.chunkedMode = false;
var ft = newFileTransfer();
ft.upload(imageURI, "https://www.example.com/upload.php", win, fail,
options);
}
functionwin(r) {
console.log("Code = " + r.responseCode);
console.log("Response = " + r.response);
console.log("Sent = " + r.bytesSent);
}
functionfail(error) {
alert("An error has occurred: Code = " + error.code);
console.log("upload error source " + error.source);
console.log("upload error target " + error.target);
}
php
<?php
move_uploaded_file($_FILES["file"]["tmp_name"], '/path/to/file');
Solution 2:
Try to encode url before sending.
ft.upload(imageURI,
encodeURI(serverURL + "/upload.php"),
function (e) {
alert('success');
},function (e) {
alert("failed");
},options);
Solution 3:
Try setting the boundary yourself adding headers to your FileUploadOptions
var headers={'Content-Type':'multipart/form-data; boundary=+++++'};
options.headers = headers;
Solution 4:
The problem was using the wrong File Transfer plugin. Not sure where I found the other plugin or why it was used but doesn't work
- <gap:pluginname="com.chanthu.evri.gcs-file-transfer"version="1.0.0" />
+ <gap:pluginname="org.apache.cordova.file-trasfer" />
Post a Comment for "Uploading Picture From Phonegap Cordova App"