How to use Cordova Camera with File Transfer

I am trying to upload a photo taken from the camera, but running into issues with tying the resulting photo with the file transfer.

I have installed the following plugins:
cordova-plugin-camera, cordova-plugin-file, cordova-plugin-file-transfer

I am able to take a picture and display it in ionic page. What I don’t understand is how to tie that photo with the file-transfer. A real end-to-end example of a live photo taken and uploaded.

So far I have come across examples of taking the photo – or – uploading a previously existing file. But not both in one go.

On a related note that I have this working using the browser camera functions and can successfully upload the file object into my web service (written in C#). It works in iOS but recently the Android device no longer offers a live photo to be taken for some reason (would love to know why).

Are there any end-to-end examples of taking a photo, uploading it – and into a C# written web-service?

1 Like

This is hard to accomplish without crashing your app.
The sad truth is that Cordova doesn’t handle the camera as very well, it just can’t handle the resizing of the photo and it crashes for memory usage issues. I hope someone replies with a working solution, but I’ve tried almost everything!

Good luck!

1 Like

I Did it once, the app uploaded images to a php server and It works fine, I don’t think there will be any difference for a c# server because the HTTP request doesn’t change anyway. So this is how I did it if that would help.
After having the imageURI from the cordova-plugin-camera. I used it next as the filePath for the cordova-plugin-file-transfer.
and that it.
more information:
to take the picture and get the imageURi : http://ngcordova.com/docs/plugins/camera/
tutorial to upload the file: http://www.gajotres.net/using-cordova-file-transfer-plugin-with-ionic-framework/

1 Like

Thanks haytam, I have a few quick questions…

When capturing the photo, is the imageURI you are referring to the same as “imageData” as mentioned in the ngcordova documentation?

And is that “imageData” based on using the option below?
destinationType: Camera.DestinationType.DATA_URL

Finally, when you do the file transfer are you using that “imageData” as the targetPath in this call below?
$cordovaFileTransfer.upload(url, targetPath, options)

(My observation has been that the articles refer to the image capture as the data bytes but then the file transfer is some physical file path; I’m not sure if it’s okay to combine those two that way or how to do that part)

SOLVED: I had two issues, one in the javascript client and another in the web service API.

Firstly, I was mixing up the meaning of sourceType and destination in Cordova (it was late and I was sleepy).

Secondly I needed to update my C# code to convert the uploaded stream from base64string to a byte array. A photo object from the browser camera is different from the photo stream obtained via the Cordova camera/file.

1 Like