Question

以下是使用dropzone.js插件在服务器上上传文件的代码：

var file_up_names = new Array;
var duplicate_files = new Array;
var token = $('input[name=_token]').val();
Dropzone.autoDiscover = false;
var dropzone = $("#addPhotosForm").dropzone({
    addRemoveLinks: true,
    dictRemoveFileConfirmation: "Do you want to remove this image?",
    dictDefaultMessage: "Drop images here to upload",
    dictRemoveFile: "Remove photo",
    init: function() {
      this.on("success", function(file, response) {
        if (response.status === 1) {
            file_up_names.push(response.filename);
            $(file.previewTemplate).append('<span class="server_file_path hide">' + response.newfilename + '</span>');
        } else if (response.status === 2) {
            duplicate_files.push(response.filename);
            this.removeFile(file);
        }
    }),
      this.on("queuecomplete", function() {
        var html = "Photos added successfully!";
        $('#photoUploadSuccess').html('');
        $('#photoUploadError').html('');
        $('#photoUploadSuccess').removeClass('hide');
        $('#photoUploadError').addClass('hide');
        if (file_up_names.length > 0) {
            if (duplicate_files.length > 0) {
                html += " Following photos are skipped as those are already uploaded.";
                html += "<ul>";
                for (var i = 0; i < duplicate_files.length; ++i) {
                    html += "<li>";
                    html += duplicate_files[i];
                    html += "</li>";
                }
                html += "</ul>";
            }
            $('#photoUploadSuccess').html(html);
        } else if (duplicate_files.length > 0 && file_up_names.length === 0) {
            html = "Following photos already exists. Please check to see if it already exists and try again.";
            html += "<ul>";
            for (var i = 0; i < duplicate_files.length; ++i) {
                html += "<li>";
                html += duplicate_files[i];
                html += "</li>";
            }
            html += "</ul>";
            $('#photoUploadSuccess').addClass('hide');
            $('#photoUploadError').removeClass('hide');
            $('#photoUploadError').html(html);
        } else {
            html = "Photos not uploaded!";
            $('#photoUploadSuccess').addClass('hide');
            $('#photoUploadError').removeClass('hide');
            $('#photoUploadError').html(html);
        }
        duplicate_files = [];
        file_up_names = [];
        setTimeout(function() {
            $('#photoUploadSuccess').html('');
            $('#photoUploadError').html('');
            $('#photoUploadSuccess').addClass('hide');
            $('#photoUploadError').addClass('hide');
        }, 5000);
    }),
    this.on("removedfile", function(file) {
        var server_file = $(file.previewTemplate).children('.server_file_path').text();
        // Do a post request and pass this path and use server-side language to delete the file
        var token = $('input[name=_token]').val();
        $.ajax({
            type: 'POST',
            headers: {'X-CSRF-TOKEN': token},
            url: "{{ URL::route('removePhotos') }}",
            data: "file_name=" + server_file,
            dataType: 'html'
        });
    })
}
});

虽然下面是我的服务器代码，它获取文件的md5并将其存储在服务器上，下次当用户再次上传相同的图像时，它会检入数据库，如果发现相同的md5_file结果，则不允许上传图像。当我使用简单的表单时，它工作，但在dropzone上它不起作用：

$tempFile = $_FILES['file']['tmp_name'];
$md5_check = md5_file($tempFile);
//check if same image uploaded before
$duplicateCheck = Photos::where('userId', '=', $this->userId)->where('md5_check', '=', "$md5_check")->where('isDeleted', '=', 0)->count();

我发现如果我将相同的图像一起上传它将无法工作并从DB返回计数0。但是如果我上传相同的上传相同的图像，例如上传相同的图像，再次上传相同的图像，它会从数据库中获取数据并给出已存在图像的消息。也许这是由于dropzone异步调用，但无法弄清楚如何处理它。

Answer 1

这是因为当您上传多个图片$_FILES包含一个文件数组时，您应该使用foreach进行循环，并在该循环内执行操作。

您可以通过插入以下代码行来检查上传多个文件时发生的情况：

var_dump($_FILES);

或者如果您希望结果更易读：

echo "<pre>".print_r($_FILES, true)."</pre>";

上传多个文件时检查$_FILES的结构，它应该是一个文件数组。

Dropzone js使用md5_file检查重复文件

1 个答案: