javascript - 您如何将 Dropzone.js 与分块文件上传一起使用(仅限 PHP)？

Question

我可以找到大量关于如何通过各种 API 和库使用分块文件上传的文档，但我无法找到如何仅通过普通 PHP 使用 Dropzone.js 分块文件上传。

文档非常少。我无法在客户端 (JavaScript) 添加除 jQuery 之外的任何库或 API。

我的问题是如何仅在服务器端将 Dropzone.js 新的分块文件上传功能与 PHP 结合使用。 (感谢客户端代码的设置)。

这是我到目前为止尝试过的代码:客户端 .js 文件:

    var myDropzone = new Dropzone("div#formDiv", 
    {
        url: "uploadform.php",
        params: function (files, xhr, chunk)
        {
            if (chunk)
            {
                return
                {
                    dzUuid=chunk.file.upload.uuid,
                    dzChunkIndex=chunk.index,
                    dzTotalFileSize=chunk.file.size,
                    dzCurrentChunkSize=chunk.dataBlock.data.size,
                    dzTotalChunkCount=chunk.file.upload.totalChunkCount,
                    dzChunkByteOffset=chunk.index * this.options.chunkSize,
                    dzChunkSize=this.options.chunkSize,
                    dzFilename=chunk.file.name;
                };
            }
        },
        method: "post",
        timeout: 600000,
        maxFileSize: 1024,
        parallelUploads: 1,
        chunking: true,
        forceChunking: true,
        chunkSize: 1000000,
        parallelChunkUploads: true,
        retryChunks: true,
        retryChunksLimit: 3,
        chunksUploaded: function (file, done)
        {
            // All chunks have uploaded successfully

        },
        error: function (msg)
        {
            alert(msg.responseText);
        }
});

这是 PHP(服务器):

foreach ($_POST as $key => $value)
{
    _log('key:' . $key . '; Value:' . $value);
}

上面的代码没有显示任何内容(_log() 只是将它回显到屏幕上并将它记录在一个文本文件中)。

我查看了发送/接收 header ，它只向服务器发送一次调用。

我已经使用浏览器中的开发人员工具控制台验证了文件拖放区域是否由 Dropzone.js 正确设置。

编辑:这是分块上传的文档:https://gitlab.com/meno/dropzone/wikis/faq#chunked-uploads

Chunked uploads

Dropzone offers the possibility to upload files in chunks. The relevant configuration options for this feature are:

chunking which should be set to true

forceChunking, if true, will always send a file in chunks, even if it is only one chunk

chunkSize in bytes

parallelChunkUploads, if true, the chunks will be uploaded simultaneously

retryChunks, if true, the library will retry to upload a chunk if it fails

retryChunksLimit defaults to 3

Then there are two important callbacks. The first one is: params which can be a function, that receives files, xhr and chunk as the first argument. If chunking is enabled, you know that files only contains that one file, and chunk is the object holding all the information about the current chunk. Example:

var chunk = {
  file: file,
  index: 0,
  status: Dropzone.UPLOADING,
  progress: 0.4
}

See the documentation for that parameter for more information or look at the source code for the default implementation.

The second important callback is chunksUploaded, which gets the file that finished uploading and the done function as second argument. Do whatever you need to do in that function, to tell the server that the file finished uploading and invoke the done() function when ready.

Answer 1

我发现我有很多问题。一是我没有使用最新版本的 Dropzone.js。

另一个是我没有检查变量和文件部分的 $_FILE 和 $_POST。

修复这些问题后，我将 JavaScript 更改为:

    var myDropzone = new Dropzone("div#formDiv", 
    {
        url: "uploadform.php",
        method: "post",
        timeout: 180000,
        maxFileSize: 1024,
        parallelUploads: 1,
        chunking: true,
        forceChunking: true,
        chunkSize: 256000,
        parallelChunkUploads: true,
        retryChunks: true,
        retryChunksLimit: 3,
    };

通过删除 params 函数，我得到了默认值。这些值包括 block 索引和最大块数。

从那里我可以使用以下方法在 PHP 脚本中获取分块文件:

$_FILE['file']['name']
$_FILE['file']['tmp_name']
$_POST['dzchunkindex']
$_POST['dztotalchunkcount']

之后，只需在 PHP 脚本中检查上传的所有文件部分，然后重新组装它们，这在互联网上很容易找到的许多教程中都有介绍。