从phonegap上传视频到php答案

【问题标题】：Uploading video from phonegap to php从phonegap上传视频到php
【发布时间】：2017-06-01 09:38:45
【问题描述】：

我正在使用这个 phonegap(js) 代码将录制的视频上传到 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 文件传输给出了错误代码 1，即找不到文件。捕获后我已经提醒文件路径与要上传的文件相同。如何抛出错误代码 1？

【问题讨论】：

mediaFile.fullPath 长什么样子？
file:///storage/emulated/0/DCIM/Camera/20170601_144112.mp4
阅读插件兼容性说明，不支持fullPath github.com/apache/…

标签： javascript php cordova phonegap

【解决方案1】：

试试这个，你也许可以用这个

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

来自网站：

如果您想将图像作为 base64 字符串发送，您可以更改目的地键入 Camera.DestinationType.DATA_URL ，您可以将 imageData 发送到服务器通过ajax调用。或者，如果您想作为文件数组发送，请保留与 camera.DestinationType.FILE_URI 相同的目标类型并使用用于在服务器中发送文件数据的cordova文件插件：

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));
}

【讨论】：

【解决方案2】：

你可以试试下面这个：

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 文件并在浏览器中打开它：

现在搜索变量“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) 中的错误：尝试更改以下内容：

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

【讨论】：

我没有收到任何错误，但文件移动到了哪个位置？因为我在我的文件夹中看不到它
alert 告诉我手机中的视频路径
文件被移动到 $destination 文件夹你需要设置一个 JS var 像： var dir = "your_path/";或者直接在你的 php 文件中设置 $destination 而不是使用 $ _POST ["dir"];
Ne charge toujours pas
你的catpurevideo函数的输出类型是什么？