php Dropzone:防止上载重复文件

4bbkushb  于 2022-12-10  发布在  PHP
关注(0)|答案(6)|浏览(155)

我正在使用Dropzone。我想阻止上传已经存在于Dropzone“面板”中的缩略图文件。上传的意思是不允许相同名称的文件在面板中显示两次。我不关心服务器中已经存在的文件没有显示在面板中的情况,因为它将被相同名称的新文件替换。
尽管我很努力,但我还是找不到办法。我很感激你的帮助。
非常感谢您的光临

mklgxw1f

mklgxw1f1#

添加以下简单的代码行:

myDropzone.on("addedfile", function(file) {
    if (this.files.length) {
        var _i, _len;
        for (_i = 0, _len = this.files.length; _i < _len - 1; _i++) // -1 to exclude current file
        {
            if(this.files[_i].name === file.name && this.files[_i].size === file.size && this.files[_i].lastModifiedDate.toString() === file.lastModifiedDate.toString())
            {
                this.removeFile(file);
            }
        }
    }
});
brtdzjyr

brtdzjyr2#

下面是我得出的解决方案:

在Dropzone初始化中添加这两个选项

dictDuplicateFile: "Duplicate Files Cannot Be Uploaded",

preventDuplicates: true,

并在dropzone初始化之上再添加一个原型函数,重新实现dropzone addFile原型函数,如下所示:

Dropzone.prototype.isFileExist = function(file) {
      var i;
      if(this.files.length > 0) {
        for(i = 0; i < this.files.length; i++) {
          if(this.files[i].name === file.name 
            && this.files[i].size === file.size 
            && this.files[i].lastModifiedDate.toString() === file.lastModifiedDate.toString())
           {
               return true;
           }
        }
      }
      return false;
    };

Dropzone.prototype.addFile = function(file) {
      file.upload = {
        progress: 0,
        total: file.size,
        bytesSent: 0
      };
      if (this.options.preventDuplicates && this.isFileExist(file)) {
        alert(this.options.dictDuplicateFile);
        return;
      }
      this.files.push(file);
      file.status = Dropzone.ADDED;
      this.emit("addedfile", file);
      this._enqueueThumbnail(file);
      return this.accept(file, (function(_this) {
        return function(error) {
          if (error) {
            file.accepted = false;
            _this._errorProcessing([file], error);
          } else {
            file.accepted = true;
            if (_this.options.autoQueue) {
              _this.enqueueFile(file);
            }
          }
          return _this._updateMaxFilesReachedClass();
        };
      })(this));
    };

如果需要,您还可以修改drozone文件。

3duebb1j

3duebb1j3#

我从服务器检查文件是否重复,然后返回错误到dropzone,见下面:

$targetPath = '/tmp/my_dropzone_files';
 $image_name = $_FILES['file']['name'];
 $targetFile =  $targetPath . '/' . $image_name; 

        $file_exists = file_exists ( $targetFile );

        if( !$file_exists ) //If file does not exists then upload
        {
            move_uploaded_file( $tempFile, $targetFile );
        }
        else //If file exists then echo the error and set a http error response
        {
            echo 'Error: Duplicate file name, please change it!';
            http_response_code(404);
        }
f3temu5u

f3temu5u4#

抱歉,无法对@Luca的回答添加评论。
需要中断循环,以防止添加多个重复文件时可能出现的问题。

myDropzone.on("addedfile", function(file) {
    if (this.files.length) {
        var _i, _len = this.files.length;
        for (_i = 0; _i < _len - 1; _i++) // -1 to exclude current file
        {
            if(this.files[_i].name === file.name && this.files[_i].size === file.size && this.files[_i].lastModifiedDate.toString() === 
file.lastModifiedDate.toString())
            {
                this.removeFile(file);
                break;
            }
        }
    }
});
vd2z7a6w

vd2z7a6w5#

我不敢相信8年多过去了,这个问题仍然存在。Manish Jangir有一个很好的解决方案来覆盖addFile函数。但是,它可以做得更好。我覆盖了addFile函数,但做了最少的工作,并在需要时调用原始函数。我激发了一个事件,而不是“alerting”,这样用户代码就可以确定要做什么。这还可以防止创建缩略图,并防止Dropzone在将来更改该功能的工作方式时出现错误。

import Dropzone from "dropzone";
    
const addFile                  = Dropzone.prototype.addFile;
Dropzone.prototype.addFile     = function (file) {
    if (this.options.preventDuplicates && this.isFileExist(file)) {
        this.emit('duplicatefile', file);
        return;
    }

    addFile.apply(this, [file]);
}
Dropzone.prototype.isFileExist = function (file) {
    let i;
    if (this.files.length > 0) {
        for (i = 0; i < this.files.length; i++) {
            if (this.files[i].name === file.name
                && this.files[i].size === file.size
                && this.files[i].lastModifiedDate.toString() === file.lastModifiedDate.toString()) {
                return true;
            }
        }
    }
    return false;
};
5lhxktic

5lhxktic6#

以下解决方案对我有帮助:

this.on('addedfile', function(file) {
    setTimeout(function() { 
        $(".dz-file-preview").remove(); // removes all files except images
    }, 3000);
});

相关问题