ios - Ionic app image upload from camera / photo library -


i'm working on ionic chat app user can upload photo part of message. i'm looking way upload image webhost server can retrieve later via url.

the problem i'm not able upload web server.

i'm using these 2 plugins:

  • org.apache.cordova.file-transfer
  • cordova-plugin-camera

when run app in xcode simulator , select picture device photolibrary, console gives me following messages:

  • file transfer finished response code 200
  • void senddelegatemessage(nsinvocation *): delegate (webview:runjavascriptalertpanelwithmessage:initiatedbyframe:) failed return after waiting 10 seconds. main run loop mode: kcfrunloopdefaultmode>
  • success: ""

this code use:

app.controller('homecontroller', function($rootscope, $scope, $cordovacamera, $ionicactionsheet, $cordovafiletransfer){ ...  // open photolibrary     $scope.openphotolibrary = function() {         var options = {             quality: 100,             destinationtype: camera.destinationtype.file_uri,             sourcetype: camera.picturesourcetype.photolibrary,             allowedit: true,             encodingtype: camera.encodingtype.jpeg,             popoveroptions: camerapopoveroptions,             savetophotoalbum: false         };          $cordovacamera.getpicture(options).then(function(imagedata) {              //console.log(imagedata);             //console.log(options);              var url = "http://mydomein.com/upload.php";             //target path may local or url             var targetpath = imagedata;             var filename = targetpath.split("/").pop();             var options = {                 filekey: "file",                 filename: filename,                 chunkedmode: false,                 mimetype: "image/jpg"             };             $cordovafiletransfer.upload(url, targetpath, options).then(function(result) {                 console.log("success: " + json.stringify(result.response));                 alert("success");                 alert(json.stringify(result.response));             }, function(err) {                 console.log("error: " + json.stringify(err));                 alert(json.stringify(err));             }, function (progress) {                 // constant progress updates                 $timeout(function () {                     $scope.downloadprogress = (progress.loaded / progress.total) * 100;                 })             });          }, function(err) {             // error             console.log(err);         });     } 


upload.php file:

<?php // move_uploaded_file($_files["file"]["tmp_name"], $cwd . '/files/images/'); move_uploaded_file($_files["file"]["tmp_name"], "/files/images"); ?> 

after digging around , lot's of trying got working.

this code came with:

// open photolibrary     $scope.openphotolibrary = function() {         var options = {             quality: 50,             destinationtype: camera.destinationtype.file_uri,             sourcetype: camera.picturesourcetype.photolibrary,             allowedit: true,             encodingtype: camera.encodingtype.jpeg,             popoveroptions: camerapopoveroptions,             savetophotoalbum: false         };          $cordovacamera.getpicture(options).then(function(imagedata) {              //console.log(imagedata);             //console.log(options);                var image = document.getelementbyid('tempimage');             image.src = imagedata;                var server = "http://yourdomain.com/upload.php",                 filepath = imagedata;              var date = new date();              var options = {                 filekey: "file",                 filename: imagedata.substr(imagedata.lastindexof('/') + 1),                 chunkedmode: false,                 mimetype: "image/jpg"             };              $cordovafiletransfer.upload(server, filepath, options).then(function(result) {                 console.log("success: " + json.stringify(result.response));                 console.log('result_' + result.response[0] + '_ending');                 alert("success");                 alert(json.stringify(result.response));              }, function(err) {                 console.log("error: " + json.stringify(err));                 //alert(json.stringify(err));             }, function (progress) {                 // constant progress updates             });           }, function(err) {             // error             console.log(err);         });     } 

and code in upload.php on domain server:

<?php  // if want find root path of folder use line of code below: //echo $_server['document_root']   if ($_files["file"]["error"] > 0){ echo "error code: " . $_files["file"]["error"] . "<br />"; } else { echo "uploaded file: " . $_files["file"]["name"] . "<br />"; echo "type: " . $_files["file"]["type"] . "<br />"; echo "size: " . ($_files["file"]["size"] / 1024) . " kilobytes<br />";  if (file_exists("/files/".$_files["file"]["name"]))   {   echo $_files["file"]["name"] . " exists. no joke-- error <i><b>impossible</b></i> get. try again, bet 1 million dollars won't ever happen again.";   } else   {   move_uploaded_file($_files["file"]["tmp_name"],"/var/www/vhosts/yourdomain.com/subdomains/domainname/httpdocs/foldername/images/".$_files["file"]["name"]);   echo "done";   } } ?> 

Comments

Popular posts from this blog

Java 3D LWJGL collision -

spring - SubProtocolWebSocketHandler - No handlers -

methods - python can't use function in submodule -