Phonegap upload issue with PHP server [message #184757] |
Thu, 30 January 2014 10:48 |
Saikat Saha
Messages: 4 Registered: January 2014
Karma: 0
|
Junior Member |
|
|
Hi, I am using the below phonegap code to upload my file to remote PHP server and I am able to upload the file even I am getting response 200 ok but on the PHP server my file is not getting received even the array is empty, I don't know PHP coding while my friend can't able to figure out the issue in PHP code,could anyone please help me out with the required PHP code we had tried every possible steps.
PHP CODE
<?php
print_r($_FILES);
$results = print_r($_FILES, 1) ;
file_put_contents('mahi.txt', $results);
print "<br>";
if ($_FILES["file"]["error"] > 0) {
echo "Return Code: " . $_FILES["file"]["error"] . "";
} else {
file_put_contents('ranga.txt', "reddy");
echo "Upload: " . $_FILES["file"]["name"] . "";
echo "Type: " . $_FILES["file"]["type"] . "";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " Kb";
echo "Temp file: " . $_FILES["file"]["tmp_name"] . "";
move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]); //Save location
echo "Stored in: " . "upload/" . $_FILES["file"]["name"];
}
?>
PHONEGAP CODE
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>PhoneGap</title>
<script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery-1.8.0.js"></script>
<script type="text/javascript" charset="utf-8">
var statusDom;
var deviceReady = false;
/**
* Function called when page has finished loading.
*/
function init() {
document.addEventListener("deviceready", function() {deviceReady = true;}, false);
window.setTimeout(function() {
if (!deviceReady) {
alert("Error: PhoneGap did not initialize. Demo will not run correctly.");
}
},2000);
}
function selectPicture() {
navigator.camera.getPicture(
function(uri) {
var img = document.getElementById('camera_image');
img.style.visibility = "visible";
img.style.display = "block";
img.src = uri;
document.getElementById('camera_status').innerHTML = "Success";
statusDom = document.querySelector('#statuss');
},
function(e) {
console.log("Error getting picture: " + e);
document.getElementById('camera_status').innerHTML = "Error getting picture.";
},
{ quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI, sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY,mediaType: navigator.camera.MediaType.ALLMEDIA});
};
/**
* Upload current picture
*/
function uploadPicture() {
// Get URI of picture to upload
var img = document.getElementById('camera_image');
var imageURI = img.src;
if (!imageURI || (img.style.display == "none")) {
document.getElementById('camera_status').innerHTML = "Take picture or select picture from library first.";
return;
}
// Verify server has been entered
server = document.getElementById('serverUrl').value;
if (server) {
// Specify transfer options
var options = new FileUploadOptions();
options.fileKey="file";
options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1);
options.mimeType="image/jpeg";
options.mimeType="image/png";
options.mimeType="image/gif";
options.mimeType = "audio/mp3";
options.mimeType = "audio/mpeg";
options.mimeType = "audio/wav";
options.mimeType = "video/mpeg";
options.mimeType = "video/quicktime";
options.mimeType = "video/mp4";
options.mimeType = "video/ogg";
options.chunkedMode = false;
var params = {};
params.value1 = "test";
params.value2 = "param";
options.params = params;
// Transfer picture to server
var ft = new FileTransfer();
alert(options.fileName);
ft.upload(imageURI, server, function(r) {
statusDom.innerHTML = "";
document.getElementById('camera_status').innerHTML = "Upload successful: "+r.bytesSent+" bytes uploaded.";
}, function(error) {
document.getElementById('camera_status').innerHTML = "Upload failed: Code = "+error.code;
}, options);
ft.onprogress = function(progressEvent) {
if (progressEvent.lengthComputable) {
var perc = Math.floor(progressEvent.loaded / progressEvent.total * 100);
statusDom.innerHTML = perc + "% loaded...";
} else {
if(statusDom.innerHTML == "") {
statusDom.innerHTML = "Loading";
} else {
statusDom.innerHTML += ".";
}
}
};
}
}
</script>
</head>
<body onload="init();">
<h3>PhoneGap Camera Upload Demo</h3>
<div>
<h3>Server URL for upload.php:</h3>
<input id="serverUrl" type="text" value="https://testserver.com/FileUpload/upload_file.php" />
</div>
<br/>
<!-- Camera -->
<div>
<h3>Camera:</h3>
<b>Status:</b> <span id="camera_status"></span><br>
<b>Image:</b> <img style="width:120px;visibility:hidden;display:none;" id="camera_image" src="" />
</div>
<div id="statuss"></div>
<!-- Actions -->
<div>
<input type="button" onclick="selectPicture();" value="Select Picture from Library" /><br/>
<input type="button" onclick="uploadPicture();" value="Upload Picture" />
</div>
<br/>
</body>
</html>
|
|
|
Re: Phonegap upload issue with PHP server [message #184758 is a reply to message #184757] |
Thu, 30 January 2014 11:31 |
Denis McMahon
Messages: 634 Registered: September 2010
Karma: 0
|
Senior Member |
|
|
On Thu, 30 Jan 2014 02:48:17 -0800, Saikat Saha wrote:
> Hi, I am using the below phonegap code to upload my file to remote PHP
> server and I am able to upload the file even I am getting response 200
> ok but on the PHP server my file is not getting received even the array
> is empty
> <?php
>
> print_r($_FILES);
If the $_FILES array is empty at this point, the the possibilities that
come to mind are:
1) Your javascript is broken
2) Something is blocking the file upload
3) A webserver configuration issue (see 2)
Have you tried using a very simple html form based upload instead? That's
a lot simpler to code in html than all that javascript, and should at
least enable you to verify that it is (or is not) possible to transfer
files from the browser to the server.
<html>
<head>
<title>test upload</title>
</head>
<body>
<form enctype="multipart/form-data" action="" method="POST">
Send this file: <input name="userfile" type="file">
<input type="submit" value="Send File">
</form>
<pre>
<?php
if ( isset( $_FILES['userfile'] ) )
print_r( $_FILES );
else
echo "Nothing";
?>
</pre>
</body>
</html>
I assume that https://testserver.com/FileUpload/upload_file.php is a url
that you have crafted to conceal the actual url, otherwise you might want
to change it to the actual webserver url you are using.
I have no idea what the purpose of the js to set options.mimeType to 10
or so different values one after the other is - but it ends up as "video/
ogg" - if this is meant to be the mimetype of the uploaded file then the
method of determining and setting it appears flawed.
In fact I have no idea what most of the js is meant to do, and if the
above mentioned php test proves that the simple file upload from your
browser to your server is working, I suggest you find a phonegap forum
for more specific assistance with your problem.
--
Denis McMahon, denismfmcmahon(at)gmail(dot)com
|
|
|
Re: Phonegap upload issue with PHP server [message #184759 is a reply to message #184757] |
Fri, 31 January 2014 10:36 |
Saikat Saha
Messages: 4 Registered: January 2014
Karma: 0
|
Junior Member |
|
|
On Thursday, January 30, 2014 4:18:17 PM UTC+5:30, Saikat Saha wrote:
> Hi, I am using the below phonegap code to upload my file to remote PHP server and I am able to upload the file even I am getting response 200 ok but on the PHP server my file is not getting received even the array is empty, I don't know PHP coding while my friend can't able to figure out the issue in PHP code,could anyone please help me out with the required PHP code we had tried every possible steps.
>
>
>
>
>
> PHP CODE
>
>
>
> <?php
>
>
>
> print_r($_FILES);
>
>
>
> $results = print_r($_FILES, 1) ;
>
>
>
> file_put_contents('mahi.txt', $results);
>
>
>
> print "<br>";
>
> if ($_FILES["file"]["error"] > 0) {
>
> echo "Return Code: " . $_FILES["file"]["error"] . "";
>
> } else {
>
>
>
> file_put_contents('ranga.txt', "reddy");
>
> echo "Upload: " . $_FILES["file"]["name"] . "";
>
> echo "Type: " . $_FILES["file"]["type"] . "";
>
> echo "Size: " . ($_FILES["file"]["size"] / 1024) . " Kb";
>
> echo "Temp file: " . $_FILES["file"]["tmp_name"] . "";
>
> move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]); //Save location
>
> echo "Stored in: " . "upload/" . $_FILES["file"]["name"];
>
> }
>
> ?>
>
>
>
>
>
> PHONEGAP CODE
>
>
>
> <!DOCTYPE HTML>
>
> <html>
>
> <head>
>
> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
>
> <meta http-equiv="Content-type" content="text/html; charset=utf-8">
>
> <title>PhoneGap</title>
>
> <script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script>
>
> <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
>
> <script type="text/javascript" charset="utf-8" src="jquery-1.8.0.js"></script>
>
> <script type="text/javascript" charset="utf-8">
>
>
>
> var statusDom;
>
>
>
> var deviceReady = false;
>
>
>
>
>
> /**
>
> * Function called when page has finished loading.
>
> */
>
> function init() {
>
> document.addEventListener("deviceready", function() {deviceReady = true;}, false);
>
> window.setTimeout(function() {
>
> if (!deviceReady) {
>
> alert("Error: PhoneGap did not initialize. Demo will not run correctly.");
>
> }
>
> },2000);
>
> }
>
>
>
> function selectPicture() {
>
> navigator.camera.getPicture(
>
> function(uri) {
>
> var img = document.getElementById('camera_image');
>
> img.style.visibility = "visible";
>
> img.style.display = "block";
>
> img.src = uri;
>
> document.getElementById('camera_status').innerHTML = "Success";
>
> statusDom = document.querySelector('#statuss');
>
> },
>
> function(e) {
>
> console.log("Error getting picture: " + e);
>
> document.getElementById('camera_status').innerHTML = "Error getting picture.";
>
> },
>
> { quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI, sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY,mediaType: navigator.camera.MediaType.ALLMEDIA});
>
> };
>
>
>
> /**
>
> * Upload current picture
>
> */
>
> function uploadPicture() {
>
>
>
> // Get URI of picture to upload
>
> var img = document.getElementById('camera_image');
>
> var imageURI = img.src;
>
> if (!imageURI || (img.style.display == "none")) {
>
> document.getElementById('camera_status').innerHTML = "Take picture or select picture from library first.";
>
> return;
>
> }
>
>
>
> // Verify server has been entered
>
> server = document.getElementById('serverUrl').value;
>
> if (server) {
>
>
>
> // Specify transfer options
>
> var options = new FileUploadOptions();
>
> options.fileKey="file";
>
> options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1);
>
>
>
> options.mimeType="image/jpeg";
>
> options.mimeType="image/png";
>
> options.mimeType="image/gif";
>
> options.mimeType = "audio/mp3";
>
> options.mimeType = "audio/mpeg";
>
> options.mimeType = "audio/wav";
>
> options.mimeType = "video/mpeg";
>
> options.mimeType = "video/quicktime";
>
> options.mimeType = "video/mp4";
>
> options.mimeType = "video/ogg";
>
> options.chunkedMode = false;
>
>
>
> var params = {};
>
> params.value1 = "test";
>
> params.value2 = "param";
>
>
>
> options.params = params;
>
>
>
>
>
>
>
> // Transfer picture to server
>
> var ft = new FileTransfer();
>
> alert(options.fileName);
>
> ft.upload(imageURI, server, function(r) {
>
> statusDom.innerHTML = "";
>
> document.getElementById('camera_status').innerHTML = "Upload successful: "+r.bytesSent+" bytes uploaded.";
>
> }, function(error) {
>
> document.getElementById('camera_status').innerHTML = "Upload failed: Code = "+error.code;
>
> }, options);
>
>
>
>
>
> ft.onprogress = function(progressEvent) {
>
> if (progressEvent.lengthComputable) {
>
> var perc = Math.floor(progressEvent.loaded / progressEvent.total * 100);
>
> statusDom.innerHTML = perc + "% loaded...";
>
> } else {
>
> if(statusDom.innerHTML == "") {
>
> statusDom.innerHTML = "Loading";
>
> } else {
>
> statusDom.innerHTML += ".";
>
> }
>
> }
>
> };
>
>
>
> }
>
> }
>
>
>
>
>
>
>
>
>
> </script>
>
>
>
> </head>
>
> <body onload="init();">
>
> <h3>PhoneGap Camera Upload Demo</h3>
>
>
>
> <div>
>
> <h3>Server URL for upload.php:</h3>
>
> <input id="serverUrl" type="text" value="https://testserver..com/FileUpload/upload_file.php" />
>
> </div>
>
> <br/>
>
>
>
> <!-- Camera -->
>
> <div>
>
> <h3>Camera:</h3>
>
> <b>Status:</b> <span id="camera_status"></span><br>
>
> <b>Image:</b> <img style="width:120px;visibility:hidden;display:none;" id="camera_image" src="" />
>
> </div>
>
> <div id="statuss"></div>
>
>
>
> <!-- Actions -->
>
> <div>
>
>
>
> <input type="button" onclick="selectPicture();" value="Select Picture from Library" /><br/>
>
> <input type="button" onclick="uploadPicture();" value="Upload Picture" />
>
> </div>
>
> <br/>
>
>
>
> </body>
>
> </html>
Hi Dennis,
Thanks for the response.
We have checked file upload using html tag type='input' and PHP server is able to capture the file but for phonegap code which is basically javascript is working fine for testserver so it proves that phonegap code is working absolutely fine there must be some issue with PHP code.
<?php
print_r($_FILES);
$results = print_r($_FILES, 1) ;
file_put_contents('mahi.txt', $results);
if ($_FILES["file"]["error"] > 0) {
file_put_contents('fail.txt', "fail");
echo "Return Code: " . $_FILES["file"]["error"] . "";
} else {
file_put_contents('success.txt', "success");
move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]); //Save location
}
?>
|
|
|
Re: Phonegap upload issue with PHP server [message #184760 is a reply to message #184757] |
Fri, 31 January 2014 12:55 |
JohnT
Messages: 16 Registered: April 2011
Karma: 0
|
Junior Member |
|
|
On Thu, 30 Jan 2014 02:48:17 -0800, Saikat Saha wrote:
> Hi, I am using the below phonegap code to upload my file to remote PHP
> server and I am able to upload the file even I am getting response 200
> ok but on the PHP server my file is not getting received even the array
> is empty, I don't know PHP coding while my friend can't able to figure
> out the issue in PHP code,could anyone please help me out with the
> required PHP code we had tried every possible steps.
>
Battled with this a few months ago.
Here are the magic runes that worked for me:
var url = [PATH TO SERVER];
var imageURI = [PATH TO FILE]
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = imageURI.substr(imageURI.lastIndexOf('/')+1);
options.mimeType = [FILE MIME TYPE];
// This header is a workaround for an Android bug that causes every
// second upload to hang
options.headers={'Connection':'close'};
var params = {};
params.token = this.accessToken;
options.params = params;
var ft = new FileTransfer();
ft.onprogress = mediauploadprogress;
ft.upload(imageURI, encodeURI(url), mediauploadsuccess, mediauploadfail,
options);
JohnT
|
|
|
Re: Phonegap upload issue with PHP server [message #184761 is a reply to message #184759] |
Fri, 31 January 2014 13:51 |
Jerry Stuckle
Messages: 2598 Registered: September 2010
Karma: 0
|
Senior Member |
|
|
On 1/31/2014 5:36 AM, Saikat Saha wrote:
>
> Hi Dennis,
>
> Thanks for the response.
>
> We have checked file upload using html tag type='input' and PHP server is able to capture the file but for phonegap code which is basically javascript is working fine for testserver so it proves that phonegap code is working absolutely fine there must be some issue with PHP code.
>
> <?php
>
> print_r($_FILES);
> $results = print_r($_FILES, 1) ;
> file_put_contents('mahi.txt', $results);
>
> if ($_FILES["file"]["error"] > 0) {
> file_put_contents('fail.txt', "fail");
> echo "Return Code: " . $_FILES["file"]["error"] . "";
> } else {
> file_put_contents('success.txt', "success");
> move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]); //Save location
>
> }
> ?>
>
You said it works on the test server, so obviously the PHP code is correct.
What's the difference between your test and production servers? For
instance, on your production server, does ./upload exist and is it
writable by the web server user? What other differences might there be?
What do you get for messages in your mahi.txt and/or fail.txt files?
--
==================
Remove the "x" from my email address
Jerry Stuckle
jstucklex(at)attglobal(dot)net
==================
|
|
|
Re: Phonegap upload issue with PHP server [message #184762 is a reply to message #184759] |
Fri, 31 January 2014 13:49 |
Luuk
Messages: 329 Registered: September 2010
Karma: 0
|
Senior Member |
|
|
On 31-01-2014 11:36, Saikat Saha wrote:
> We have checked file upload using html tag type='input' and PHP server is able to capture the file but for phonegap code which is basically javascript is working fine for testserver
> so it proves that phonegap code is working absolutely fine.....
for testserver it works fine.
But what about your non-testserver?
It seems to be broken!
What was the output of the suggestion from Dennis?
|
|
|