Cordova FileUpload API returns error code 3

Question

I am having problem trying to upload an image file to my local web server (hosted using wampserver) for android hybrid app built using IBM Worklight 6.2.0 with Cordova version 3.4.0. The code snippet is as below:

<script type="text/javascript" charset="utf-8">
  // Wait for Cordova to load
  document.addEventListener("deviceready", onDeviceReady, false);

  // Cordova is ready
  function onDeviceReady() {
    // Nothing here
  }

  function getImage() {
    // Retrieve image file location from specified source
    navigator.camera.getPicture(uploadPhoto, function(message) {
      alert('get picture failed');
    }, {
      quality: 40,
      destinationType: Camera.DestinationType.FILE_URI,
      sourceType: Camera.PictureSourceType.PHOTOLIBRARY
    });

  }

  function uploadPhoto(imageURI) {
    var options = new FileUploadOptions();
    options.fileKey = "file";
    options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1);
    options.mimeType = "image/jpeg";

    var params = new Object();
    params.value1 = "test";
    params.value2 = "param";

    options.params = params;
    options.chunkedMode = false;

    var ft = new FileTransfer();
    ft.upload(imageURI, encodeURI("http://192.168.1.4:8081/folder_name/upload2.php"), win, fail, options);
  }

  function win(r) {
    console.log("Code = " + r.responseCode);
    console.log("Response = " + r.response);
    console.log("Sent = " + r.bytesSent);
    alert(r.response);
  }

  function fail(error) {
    alert("An error has occurred: Code = " + error.code);
  }
</script>

<button onclick="getImage();">Upload a Photo</button>

upload2.php

<?php print_r($_FILES); $new_image_name="namethisimage.jpg" ; move_uploaded_file($_FILES[ "file"][ "tmp_name"], "folder_name/uploads/".$new_image_name); ?>

I'm getting http status 200 and an error code 3. Besides that, I also getting this error below the http status and error code error.

java.lang.SecurityException: Permission Denial: reading com.android.providers.media.MediaDocumentsProvider uri content://com.android.providers.media.documents/document/image:14584 from pid=4926, uid=10092 requires android.permission.MANAGE_DOCUMENTS, or grantUriPermission()

Is there any solution to this? Or is there a better way for me to upload the image file?

I've added the following to AndroidManifest.xml

<uses-permission android:name="android.permission.MANAGE_DOCUMENTS"/> 
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

1) the deviceready call is not required; Worklight does this for you internally, otherwise the app would not function at all. — Idan Adar
2) Make sure you've added android:permission="android.permission.MANAGE_DOCUMENTS" — Idan Adar
@IdanAdar Forgot to mention that I've already added the MANAGE_DOCUMENTS permission in AndroidManifest.xml. I have removed the deviceready call, it still returning error code 3. — imationyj
Yes, it's just not needed, that is all. The issue does not seem to be originating from Worklight here. — Idan Adar
Yeah, it's probably from either cordova or with my web server. I have found out that the meaning of server code error 3 is Permission denied: The user does not have sufficient permissions to perform the operation as seen from here. Not sure about what the real problem is thou. I have tried directly accessing an image file in my web server using <img> tag with AngularJS ng-src and the image can be shown on the page in my mobile. — imationyj

imationyj imationyj · Accepted Answer · 2015-03-14T08:10:37

I am not sure what's the issue here. My code just works suddenly, even with AngularJS. I will just share my working code here, if others might want to refer.

main.js

$scope.getImage = function() {
             // Retrieve image file location from specified source
             navigator.camera.getPicture(onSuccess, function(message) {
                alert('get picture failed');
            },{
                quality: 50, 
                destinationType: Camera.DestinationType.FILE_URI,
                sourceType: Camera.PictureSourceType.PHOTOLIBRARY
            }
             );
         }

        function onSuccess(imageURI) {
            $scope.image = imageURI;
        };

         function uploadPhoto(image) {

             var options = new FileUploadOptions();
             options.fileKey="file";
             options.fileName= $scope.imageName;
             options.mimeType="image/jpeg";

             var params = new Object();
             params.value1 = "test";
             params.value2 = "param";

             options.params = params;
             options.chunkedMode = false;

             var ft = new FileTransfer();
             ft.upload(image, encodeURI(ipaddress_to_your_server/root_folder/upload.php), win, fail, options);
         }

         function win(r) {
             console.log("Code = " + r.responseCode);
             console.log("Response = " + r.response);
             console.log("Sent = " + r.bytesSent);
             alert(r.response);
         }

         function fail(error) {
             alert("An error has occurred: Code = " + error.code);
         }

upload.php

<?php
print_r($_FILES);
$image_name = $_FILES['file']['name'];
move_uploaded_file($_FILES["file"]["tmp_name"], "uploads/".$image_name);
?>

You will just need to call the $scope.getImage function in html to open the device's photo library.

Cordova FileUpload API returns error code 3

2 Answers