Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.lang.php > #12725 > unrolled thread

Phonegap upload issue with PHP server

Started bySaikat Saha <saikat.saha5@gmail.com>
First post2014-01-30 02:48 -0800
Last post2014-01-31 12:55 +0000
Articles 6 — 5 participants

Back to article view | Back to comp.lang.php


Contents

  Phonegap upload issue with PHP server Saikat Saha <saikat.saha5@gmail.com> - 2014-01-30 02:48 -0800
    Re: Phonegap upload issue with PHP server Denis McMahon <denismfmcmahon@gmail.com> - 2014-01-30 11:31 +0000
    Re: Phonegap upload issue with PHP server Saikat Saha <saikat.saha5@gmail.com> - 2014-01-31 02:36 -0800
      Re: Phonegap upload issue with PHP server Jerry Stuckle <jstucklex@attglobal.net> - 2014-01-31 08:51 -0500
      Re: Phonegap upload issue with PHP server Luuk <luuk@invalid.lan> - 2014-01-31 14:49 +0100
    Re: Phonegap upload issue with PHP server JohnT <john-sospam@jtresponse.co.uk> - 2014-01-31 12:55 +0000

#12725 — Phonegap upload issue with PHP server

FromSaikat Saha <saikat.saha5@gmail.com>
Date2014-01-30 02:48 -0800
SubjectPhonegap upload issue with PHP server
Message-ID<eb014c74-865d-48ae-beac-b26b4c555675@googlegroups.com>
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>

[toc] | [next] | [standalone]


#12726

FromDenis McMahon <denismfmcmahon@gmail.com>
Date2014-01-30 11:31 +0000
Message-ID<lcdd6m$2ds$2@dont-email.me>
In reply to#12725
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@gmail.com

[toc] | [prev] | [next] | [standalone]


#12727

FromSaikat Saha <saikat.saha5@gmail.com>
Date2014-01-31 02:36 -0800
Message-ID<97079774-e828-4c17-862d-1060789d621b@googlegroups.com>
In reply to#12725
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

}
?>

[toc] | [prev] | [next] | [standalone]


#12729

FromJerry Stuckle <jstucklex@attglobal.net>
Date2014-01-31 08:51 -0500
Message-ID<lcg9of$hkk$1@dont-email.me>
In reply to#12727
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@attglobal.net
==================

[toc] | [prev] | [next] | [standalone]


#12730

FromLuuk <luuk@invalid.lan>
Date2014-01-31 14:49 +0100
Message-ID<79msra-hm6.ln1@luuk.invalid.lan>
In reply to#12727
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?

[toc] | [prev] | [next] | [standalone]


#12728

FromJohnT <john-sospam@jtresponse.co.uk>
Date2014-01-31 12:55 +0000
Message-ID<lcg6g8$e6o$1@dont-email.me>
In reply to#12725
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

[toc] | [prev] | [standalone]


Back to top | Article view | comp.lang.php


csiph-web