Question

我正在尝试使用blueimp jquery fileupload库执行多个文件上传。链接到库-https://github.com/blueimp/jQuery-File-Upload

文件正在上传。但是一次只能上传一个文件。多个文件也正在上传，但单个文件一次已上传。我不确定这是什么错误。

PHP

<?php

// A list of permitted file extensions
$allowed = array('png', 'jpg', 'gif','zip', 'html','php', 'py', 'jpeg', 'txt');
for ($i=0; $i < count($_FILES); $i++) { 
if(isset($_FILES['files']) && $_FILES['files'][$i]['error'] == 0){

    $extension = pathinfo($_FILES['files'][$i]['name'], PATHINFO_EXTENSION);

    if(!in_array(strtolower($extension), $allowed)){
        echo '{"status":"error 1", "extension": "'.$extension.'"}';
        exit;
    } 
    if(move_uploaded_file($_FILES['files'][$i]['tmp_name'], __DIR__.'/upl/'.$_FILES['files'][$i]['name'])){
        echo '{"status": "success"}';
    }
}
else {
    echo '{"status":"error"}';
    exit;
}

}

?>

HTML

<div class="message">
<h1>Files to be uploaded: </h1>
</div>
<div class="result">
</div>
<input id="fileupload" type="file" name="files[]" multiple>
<br><br>
<input type="submit" name="submit" id="upload">

JS

$(function () {
 $('#fileupload').fileupload({
    dataType: 'json',
    url: 'act',
    add: function(e,data) {
      console.log("added for uploading"); 
      console.log(data.files[0].name);
      if( $(".message").is(":hidden") ) {
        $(".message").show();
      }
      $(".message").append("<p>"+ data.files[0].name + "</p>");
      $("#upload").click(function(){
        data.submit();
      })
    },
    start: function (e) {
    console.log('start');
    },
    done: function (e, data) {
      console.log("success in uploading data");
      console.log(data);
      console.log(data.files[0].name);
        // $.each(data.files, function (index, file) {
        //     $('<p/>').text("file name: " + file.name).appendTo($(".message"));
        // });
      $(".message").hide();
      $(".result").append("Uploading files");
    },
    fail: function (e, data) {
      console.log(data);
      console.log("failed to perform");
        $.each(data.messages, function (index, error) {
            $('<p style="color: red;">Upload file error: ' + error + '<i class="elusive-remove" style="padding-left:10px;"/></p>')
            .appendTo('.message');
        });
    }
});
});

多个文件正在上传。但一次只能上传一个文件。我的意思是，如果我提交了3个文件，则只会首先发送第一个文件进行上传，然后发送第二个文件，最后发送第三个文件。而不是将所有三个文件作为数组发送。每次将发送一个文件。即总共将发送3个数组。而且任何人都可以帮助您执行分块。谢谢！

更新将数据附加到data.files时会出现问题，而不是将文件附加到数组中，而是每次都会创建一个新对象。但是我不确定为什么要这么做！

Answer 1

最后一点阅读文档。我发现，通常blueimp fileuploader每个文件发出一个请求。这就是为什么我每次上传不同文件时都会不同时间上传每个文件的原因。

为同一请求处理多个文件。

$('#fileupload').fileupload({
    dataType: 'json',
    autoUpload: false,
    url: 'act',
    maxChunkSize: 10000000,
    maxFileSize: 1000000000,
    singleFileUploads: false,

singleFileUploads: false实际上是禁止单个文件上传。我是从这里的文档中获得的-https://github.com/blueimp/jQuery-File-Upload/wiki/Options#singlefileuploads

感谢所有帮助

使用JQuery blueimp上传多个文件

1 个答案: