2017-06-01 74 views
2

我正在使用此phonegap(js)代码上传录制的视频到php服务器。从手机上传视频到php

<!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> 

这是我的PHP代码..

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

的uploadFile功能应该将文件上传到指定的PHP文件。但在我的情况下,phonegap filetransfer给出错误代码1,这是文件未找到。捕获之后我会提醒文件路径,这是相同的文件上传。它如何抛出错误代码1?

+0

以及如何'媒体文件.fullPath' l ooks喜欢? – jcesarmobile

+0

file:///storage/emulated/0/DCIM/Camera/20170601_144112.mp4 –

+0

阅读插件兼容性说明,不支持fullPath https://github.com/apache/cordova-plugin-file-transfer#backwards-兼容性注意事项 – jcesarmobile

回答

0

你可以试试下面这个:

function upload(file){ 

     var fd = new FormData(); 
     fd.append("dir", dir); 
     fd.append("file", file); 
     var xhr = new XMLHttpRequest(); 

     xhr.open('POST', 'upload.php', true); 
     xhr.send(fd); 


     xhr.onreadystatechange = function() { 

       if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) { 

         //alert(xhr.responseText); 
         var message = xhr.responseText; 
         message=message.trim(); 

         if (message != 0) 
         { 
          //alert(message); 
         }   
       } 
     }; 
    } 

和PHP文件:

<?php 
    if (isset($_FILES["file"]["name"])) { 

     $destination = $_POST["dir"]; 

     $name = $_FILES["file"]["name"]; 
     $tmp_name = $_FILES['file']['tmp_name']; 
     $error = $_FILES['file']['error']; 



     //echo $name; 
     //echo $tmp_name; 
     //echo $error; 

     move_uploaded_file($_FILES['file']['tmp_name'], $destination.$name); 

    } 

    echo "File transfer completed"; 
?> 

XHR POST没有大小限制,但你将数据发送到PHP具有大小限制;)创建以下php文件,并在浏览器中打开它:

现在搜索v良莠不齐“的post_max_size”,这个变量限制了可以发送到PHP的最大数据(但它可以在php.ini更改)


我的上传功能,我的PHP文件完全适用于像输入文件:

var obj=document.getElementById("inputfile"); 

var len = obj.files.length; 

for (i=0; i<=len; i++){ 

    upload(obj.files[i]); 
} 

对我来说,问题是你capturevideo的输出类型()函数或captureSuccess(mediaFiles)的错误:试图更改smomething像下面这样:

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

我更新我的答案:) – Aotoki

+0

我没有得到任何错误,但文件移动到哪个位置?因为我无法在我的文件夹中看到 –

+0

警报提供给我视频在我的手机中的路径 –