Uploading video from phonegap to php

Viewed 644

I am using this phonegap(js) code to upload a recorded video to php server.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
    <title>Mobile_Insurance</title>

    </head>
    <body>

    <script type="text/javascript">

        $(document).ready(function(){
    $('input[name="visit"]').click(function(){
    var inputValue = $(this).attr("value");
    var targetBox = $("." + inputValue);
    $(".box").not(targetBox).hide();
    $(targetBox).show();
    });
    });


     function captureSuccess(mediaFiles) {
        var i, len;
        for (i = 0, len = mediaFiles.length; i < len; i += 1) {
            uploadFile(mediaFiles[i]);
        }
      }

    // Called if something bad happens.
    //
    function captureError(error) {
        var msg = 'An error occurred during capture: ' + error.code;
        navigator.notification.alert(msg, null, 'Uh oh!');
    }

    // A button will call this function
    //
    function captureVideo() {
        // Launch device video recording application,
        // allowing user to capture up to 2 video clips
        navigator.device.capture.captureVideo(captureSuccess, captureError, {limit: 1});
    }

    // Upload files to server
    function uploadFile(mediaFile) {
    var ft = new FileTransfer(),
    path = mediaFile.fullPath,
    name = mediaFile.name;
    var options = new FileUploadOptions();
    options.chunkedMode = true;
        options.fileKey = "file";
        options.fileName = name;
        options.mimeType = "video/mp4";
    var params = new Object();
    params.value1 = "test";
    params.value2 = "param";

    options.params = params;

    ft.upload(path, "http://192.168.0.46/upload/upload.php",
    function(result) {
        console.log('Upload success: ' + result.responseCode);
        console.log(result.bytesSent + ' bytes sent');
        console.log("Response = " + r.response);
        alert("Response = " + r.response);
     },
    function(error) {
        console.log('Error uploading file ' + path + ': ' + error.code);
        alert('Error uploading file ' + path + ': ' + error.code);
    },
    options); 
    alert(mediaFile.fullPath);
    }
    </script>
    <script type="text/javascript" src="cordova.js"></script>
    <div data-role="page">
        <div data-role="header">
          <h3>Welcome </h3>
        </div>
        <div data-role="main" class="ui-content">
          <h3 style="text-align: center;">Input Your IMEI:</h3>
          <input type="number"/>
          <h3 style="text-align: center;"> yes?</h3>

          <input type="radio" name="visit" value="YES"  id="Video">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; YES 
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <input type="radio" name="visit" value="NO" id="self">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; NO
          <br>
          <h3 style="text-align: center;"> damage.</h3>
          <input type="radio" name="damage" value="Physical">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Physical
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <input type="radio" name="damage" value="Water">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Water <br><br>
          <h3 style="text-align: center;">Please give a breig description about the damage</h3><br>
            <textarea rows="5" cols="10" style="resize:none"></textarea>
           <div class="YES box"><input type="button"  value="self analysis" hidden="true"></div> 
            <div class="NO box"> <button onclick="captureVideo();">Capture Video</button></div>

        </div>
      </div>
      </body>
      </html>

This is my php code..

<?php
  print_r($_FILES);
  $new_image_name = "r.mp4";
  move_uploaded_file($_FILES["file"]["tmp_name"], $new_image_name);
?>

The uploadFile function is supposed to upload the file to the specified php file. but in my case the phonegap filetransfer is giving error code 1 which is file not found. I have alert the file path after capture which is same file to be uploaded. How is it throwing error code 1?

2 Answers

Try this, you might be able to use this

http://findnerd.com/list/view/Capturing-and-Uploading-Video-to-PHP-Server-in-Cordova/9398/

From the site:

If you want to send image as base64 string you can change destination type to Camera.DestinationType.DATA_URL and you can send imageData to server via ajax call. or, if you want to send as file array then keep the same destination type to camera.DestinationType.FILE_URI and use cordova file plugin to send file data in server:

var options = new FileUploadOptions();
options.fileKey="tickitFile";
options.fileName=imageData.substr(imageData.lastIndexOf('/')+1);
options.contentType = "multipart/form-data";
options.chunkedMode = false;
options.mimeType="image/jpeg";
options.httpMethod="POST";
options.headers =   {
    Connection: "close"
};    


var ft = new FileTransfer();


ft.upload(imageData, PHP&#95;URL, win, fail, options);
function win(r) {
    console.log("Response = " + r.response);
    console.log("Sent = " + r.bytesSent); 
}
function fail(error) { 
    console.log(JSON.stringify(error));
} 
Related