无法使用 dropzone 发送超过 4 个文件

Question

这很奇怪...

我可以使用 dropzone 发送 0、1、2、3、4 个文件，但不能发送 5 个或更多..

我想我在这里正确定义了选项：

Dropzone.options.myDropzone = {
    url: "action.php",
    autoProcessQueue: false,
    uploadMultiple: true,
    parallelUploads: 6,
    maxFilesize: 5, 
    maxFiles: 6,
    addRemoveLinks: true,
    paramName: 'userfile',
    acceptedFiles: 'image/*',
    dictMaxFilesExceeded: 'Too many files! Maximum is {{maxFiles}}',

    // The setting up of the dropzone
    init: function() {
        dzClosure = this; // Makes sure that 'this' is understood inside the functions below.
        // for Dropzone to process the queue (instead of default form behavior):
        document.getElementById("submit-form").addEventListener("click", function(e) {
            e.preventDefault();
            e.stopPropagation();
            // Make sure that the form isn't actually being sent.
            // If the user has selected at least one file, AJAX them over.
            if (dzClosure.files.length !== 0) {
                // dzClosure.options.autoProcessQueue = true;
                dzClosure.processQueue();
            // Else just submit the form and move on.
            } else {
                $('#foorm').submit();
            }
        });
        // send all the form data along with the files:
        this.on("sendingmultiple", function(data, xhr, formData) {
            formData.append("name", $("#name").val());
            formData.append("email", $("#email").val());
        }); 
        this.on("sucessmultiple", function(files, response) {
            // dzClosure.options.autoProcessQueue = false;
            $(location).attr('href', 'message_sent.html')
        });
    }
}

我说对了，因为当我拖动超过 6 个文件时，我看到错误消息：Too many files! Maximum is 6

这个边界在源代码中有意义吗？

更多细节：我的表格的简化版本如下

<form id="foorm" method="post" action="action.php" enctype="multipart/form-data">
    <input type="text" id="name" name="name" required>
    <input type="email" id="email" name="email" required>
    <div class="dropzone" id="myDropzone">
    <button type="submit" name="submit-form" id="submit-form">Send!</button>
</form>

和我的 action.php 开始显示 json_encode($_FILES); 和 json_encode($_POST);

发送少于 4 个文件时符合预期，发送 5 个或更多文件时 []

编辑

小一点的好像可以上传5个以上！除了 dropzone 上的错误，这还能是什么吗？（诚实的问题）

Answer 1

试试这个，将 uploadMultiple 设置为 false，将 autoProcessQueue 设置为 true

把下面的事件放到init来设置你可以上传多少

this.on('addedfile', function(file) {
  if (this.files[10] != null) {
    this.removeFile(this.files[0]);
  }
});
this.on('maxfilesreached', function(file) {
  if (this.files[10] != null) {
    this.removeFile(this.files[0]);
  }
});

完整代码：

Dropzone.options.myDropzone = {
  url: "action.php",
  autoProcessQueue: true,
  uploadMultiple: false,
  parallelUploads: 10,
  maxFilesize: 5,
  maxFiles: 10,
  addRemoveLinks: true,
  method: 'put',
  dictMaxFilesExceeded: 'Too many files! Maximum is {{maxFiles}}',
  init: function() {
    this.on('processing', function(file) {
      data = file;
      console.log(this.options.url);
    });
    this.on('addedfile', function(file) {
      if (this.files[10] != null) {
        this.removeFile(this.files[0]);
      }
    });
    this.on('maxfilesreached', function(file) {
      if (this.files[10] != null) {
        this.removeFile(this.files[0]);
      }
    });
    this.on('success', function(file, resp) {
      if (this.getUploadingFiles().length === 0 && this.getQueuedFiles().length === 0) {
          setTimeout(function () {
             console.log('all are uploaded');
          }, 500);
      }
    });
    this.on("error", function(file, errorMessage, xhr) {
      alert(file.name + ": " + errorMessage)
    });
    this.on("queuecomplete", function(file) {
      alert("queuecomplete");
    });
    this.on("sending", function(file, xhr, formData) {
      var _send = xhr.send;
      xhr.send = function() {
        _send.call(xhr, file);
      }
    });
  }
}

Answer 2

只需将 parallelUploads 参数设置为与 maxFiles 选项的值相同

Answer 3

根据最近的评论，问题似乎是您受到 PHP 文件上传设置的限制。

在 php.ini 中增加 upload_max_filesize。默认为“2M”（2Mb）。

您可能还需要增加 post_max_size，它的默认值为“8M”。并且不要忘记重新启动 HTTP 服务器。

http://php.net/manual/en/ini.core.php#ini.file-uploads

无法使用 dropzone 发送超过 4 个文件

Cannot send more than 4 files with dropzone

javascript

php

file-upload

dropzone.js

完整代码：