Upload image from mobile device to a remote Server using Icenium Cordova and ASP.NET

Question

I am trying to figure out a way to to upload an image from the mobile phone to a remote server using Icenium+Cordova (mobile) and ASP.NET.

I did try to use FileTransfer() command while providing a remote webservice address but without success. I am using Icenium simulator and Visual Studio to test the code locally.

What I need is a code example of the mobile (Javascript) and Server (.NET) side to support that image upload communication. Thanks.

The code that I am currently using:

function uploadPhoto(imageURI) { 
    var options = new FileUploadOptions(); 
    options.fileKey="image_file"; // recFile
    var imagefilename = Number(new Date())+".png"; 
    options.fileName=imagefilename; 
    options.mimeType=  "text/plain"; 
    options.chunkedMode = false;

    params = {
        val1: "some value",
        val2: "some other value"
    };
    options.params = params;


    var ft = new FileTransfer(); 

    ft.upload(imageURI,"http://127.0.0.1:1691/ImageWebService.asmx/SaveImage", success, fail, options);

}

On the server side:

 [WebMethod]
    [ScriptMethod]
    public string SaveImage()
    {
        try
        {
            HttpPostedFile file = HttpContext.Current.Request.Files[0];
            if (file == null)
                return "0";

            HttpPostedFile file =
            HttpContext.Current.Request.Files[0];
            string targetFilePath = "c:\\" + file.FileName;
            file.SaveAs(targetFilePath);
        }
        catch (Exception ex)
        {
        }

        return "1";

    }

I also have:

<access origin="*" />

In the config.xml for cordova.

Note: I tested the webservice for image upload using the standard file upload control using "Advanced Rest Client" and it returned 200 OK.

Other than that, I'm stuck and can find a way to successfully upload am image to the remote server. I am open to using other method, but I think that using the native Cordova FileTransfer() is the safer way to do that if I want the best comparability.

score 1 · Answer 1 · answered Oct 13 '13 at 11:49

I suppose you are trying to compile with cordova version 3. From what I have understood, in cordova-3 most of the device-level API has been moved to external plugins: Read "Accessing the Feature" in http://cordova.apache.org/docs/en/3.0.0/cordova_file_file.md.html#File

So in Icenium it doesn't work anymore. If you try to go in you project properties and set cordova 2.7.0 everything will works.

To be sure add this line in your main javascript, in the deviceready event:

alert("deviceReady!");
alert(device.platform);

if you get both alert msg, the app is working correctly and also the filetransfer will work.

But if you import the File-Transfer GitHub project in Icenium, still using the cordova-3, it will work correctly. That's really a mistery and only Telerik can explain us what they are doing!

Ciao Marco

Using 3.0 and got the two alerts. I tried changing to 2.7 and also 3.0 + installed plugin in the plugins folder but still image upload deosn't work :[ — Liron Harel, Oct 13 '13 at 14:07

score 1 · Accepted Answer · answered Oct 14 '13 at 12:36

You should use machine name and your device should be connected to the same network. There is no way for your device to know what 127.0.0.1 is, as it is a loopback address. Always test your services by trying to access them from a browser from another machine. Cordova version has nothing to do with it, Icenium provides all device API even now, there is no need to manually include them as separate plugins.

Upload image from mobile device to a remote Server using Icenium Cordova and ASP.NET

2 Answers2