使用 DropzoneJS 并行上传多张图片

Question

目前我有一个有效的 DropzoneJS 实现，用户可以在其中 select 多张图片并上传它们。有一个参数 parallelUploads 在实践中似乎决定一次可以上传多少张图片，例如当 Select Files如果用户 select 有 10 个文件，但 parallelUploads:5 则只有前 5 个图像会上传成功，其余 5 个将被忽略，这 5 个图像通过单个 HTTP [=] 发送31=]请求。

我希望能够做的是对其进行配置，使上传图片的数量没有限制，但可以批量上传。例如，如果用户 select 有 30 张图片，我希望它们全部上传成功，或者每个 HTTP POST 请求有 1 张图片，或者每个 HTTP POST 有一个定义的数量这样为 5。如果我设置 parallelUploads:30，那么服务器需要大量内存才能一次尝试对 30 张图像进行服务器端处理，这似乎不是一个很好的解决方案。

如何将其配置为针对每张图片启动单独的 HTTP POST 请求，或者一次仅针对定义数量的图像启动请求，而不限制用户在一次操作中上传的图像数量？

<link rel="stylesheet" type="text/css" href="dropzone.css" media="all" />
<script type="text/javascript" src="dropzone.min.js"></script>

<div id="pnlPhotoThumbnails"></div>
<div class="clearfix">
  <form id="frmUpload" method="post" enctype="multipart/form-data"
        action="photo-upload.json" class="dropzone">
    <input type="file" name="photo" id="photo" />
  </form>
</div>

<style type="text/css">
#frmUpload input[type=file]{display:block;height:0;width:0;}
</style>

<script type="text/javascript">
function RefreshPhotos(){ $('pnlPhotoThumbnails').load('photo-thumbnails.php'); }
$(function(){
  $('frmUpload').dropzone({
    acceptedFiles: '.jpg',
    parallelUploads: 5,
    init:function(){
      var hDropzone = this;
      this.on('success', function(){ RefreshPhotos(); hDropzone.removeAllFiles(); });
    }
  });
});
</script>

注意：上面是一个类似于我的实现的示例代码，尽管我对它进行了一些编辑以使问题具有普遍性而不是特定于我的项目，并且希望有足够的代码来说明它是如何实现的工作如此牢记它不完整和功能仅从这个片段！ photo-upload.json 将是一个服务器端脚本来处理文件上传和 return 一个 JSON succcess/error 响应，photo-thumbnails.php 将 return HTML 每个照片缩略图都有 <img/> 个标签。

Answer 1

事实证明，以下配置可以解决这个问题，在这种特定情况下，一次用户操作最多可以上传 100 个文件，但每个图像上传都有一个单独的 HTTP POST 请求.

从 DropzoneJS 4.0 版开始，似乎不可能（如果我错了请纠正我）将允许一次上传的文件数量设置为 无限制 ，或者定义多张图片一起批量上传，要么全部一起上传，要么全部分开上传：

parallelUploads: 100,
uploadMultiple: false

使用 DropzoneJS 并行上传多张图片

Parallel uploads for multiple images using DropzoneJS

file-upload

jquery-plugins

dropzone.js