PhoneGap to php image upload works every other time

Question

I'm finding that if you upload an image using phonegap with php on the server, it works every other time. Consistently. The first upolad succeeds, the second fails, the third succeeds, the fourth fails and so on.

I'm using an example located here: How to retrieve POST data from PhoneGaps File Transfer API

And I'm using an android phone to test.

// Wait for PhoneGap to load
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is ready

function onDeviceReady() {
    console.log("device ready");
    // Do cool things here...
}

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

function captureImage() {
    // Retrieve image file location from specified source
    navigator.camera.getPicture(uploadPhoto, function(message) {
        alert('get picture failed');
    }, {
        quality: 50,
        destinationType: navigator.camera.DestinationType.FILE_URI
    });
}

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, "http://someserver.com/somedir/up.php", win, fail, options);
}

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

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

And php

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

Please post **your** code. – larsAnders Apr 08 '14 at 18:09 — larsAnders, Apr 08 '14 at 18:09

score 0 · Accepted Answer · answered Apr 08 '14 at 19:33

This is somewhat common issue but can be easily bypassed. When the upload fails, just retry a few times until it works.

uploadPhoto function(imageURI) {
    ft.upload(filePath, yourUrl, function(response) {
                    console.log("SUCCESS")
                }, function(e) {
                    console.log("## FAIL")
                    if(uploadRetry < 4){
                        uploadRetry++;
                        uploadPhoto(imageURI);
                    } else {
                        //HANDLE FAIL AFTER IT FAILS TOO MANY TIMES
                    }
                }, options, true);
}

it usually works on second try.

score 0 · Answer 2 · answered Apr 09 '14 at 12:09

try this one

var pictureSource; // picture source
var destinationType; // sets the format of returned value
 // Wait for device API libraries to load
 //
document.addEventListener("deviceready", onDeviceReady, false);
// device APIs are available
 //

function onDeviceReady() {
    pictureSource = navigator.camera.PictureSourceType;
    destinationType = navigator.camera.DestinationType;
}
// Called when a photo is successfully retrieved
 //

function onPhotoDataSuccess(imageURI) {
    // Uncomment to view the base64-encoded image data
    // console.log(imageData);
    // Get image handle
    //
    var smallImage = document.getElementById('image');
    // Unhide image elements
    //
    smallImage.style.display = 'block';
    // Show the captured photo
    // The inline CSS rules are used to resize the image
    //
    smallImage.src = imageURI;
    upload(imageURI);
}
// Called when a photo is successfully retrieved
 //

function onPhotoURISuccess(imageURI) {
    // Uncomment to view the image file URI
    // console.log(imageURI);
    // Get image handle
    //
    var largeImage = document.getElementById('image');
    // Unhide image elements
    //
    largeImage.style.display = 'block';
    // Show the captured photo
    // The inline CSS rules are used to resize the image
    //
    largeImage.src = imageURI;
    upload(imageURI);
}
// A button will call this function
 //

function capturePhoto() {
    // Take picture using device camera and retrieve image as base64-encoded string
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, {
        quality: 30,
        targetWidth: 600,
        targetHeight: 600,
        destinationType: destinationType.FILE_URI,
        saveToPhotoAlbum: true
    });
}
// A button will call this function
 //

function capturePhotoEdit() {
    // Take picture using device camera, allow edit, and retrieve image as base64-encoded string
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, {
        quality: 30,
        targetWidth: 600,
        targetHeight: 600,
        allowEdit: true,
        destinationType: destinationType.FILE_URI
    });
}
// A button will call this function
 //

function getPhoto(source) {
    // Retrieve image file location from specified source
    navigator.camera.getPicture(onPhotoURISuccess, onFail, {
        quality: 30,
        targetWidth: 600,
        targetHeight: 600,
        destinationType: destinationType.FILE_URI,
        sourceType: source
    });
}
// Called if something bad happens.
 //

function onFail(message) {
    alert('Failed because: ' + message);
}

function upload(imageURI) {
    var options = new FileUploadOptions();
    options.fileKey = "file";
    options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1);
    options.mimeType = "image/jpeg";
    var params = new Object();
    params.param1 = "param 1";
    params.param2 = "param 2";
    options.params = params;
    options.chunkedMode = false;
    var ft = new FileTransfer();
    ft.upload(imageURI, "https://example.com/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);
    }
}

I get the same result: success every other time. – aarffy Apr 09 '14 at 15:37 — aarffy, Apr 09 '14 at 15:37

PhoneGap to php image upload works every other time

2 Answers2