javascript Dropzone：防止上传重复文件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26296232/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dropzone: prevent uploading of duplicate files
提问by Unknown developer
I am using Dropzone. I'd like to prevent the uploading of a file which already exists as thumbnail in Dropzone "panel". With uploading I mean not to allow a file with the same name to be shown twice in the panel. I do not care about the case of the file already existing in the server and not showing in the panel, since it will be replaced by the new one with the same name.
我正在使用 Dropzone。我想阻止上传已作为缩略图存在于 Dropzone“面板”中的文件。上传我的意思是不允许同名文件在面板中显示两次。我不关心服务器中已经存在的文件并且没有显示在面板中的情况，因为它将被具有相同名称的新文件替换。
I cannot find how to achieve that despite my efforts. I'd appreciate your help.
尽管我很努力，但我找不到如何实现这一目标。我很感激你的帮助。
Thank you very much
非常感谢你
回答by Luca Perico
Add these simple lines of code:
添加这些简单的代码行：
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);
}
}
}
});
回答by Manish Jangir
Here is the solution I came to:
这是我找到的解决方案：
Add these two options in your Dropzone initialization
在 Dropzone 初始化中添加这两个选项
dictDuplicateFile: "Duplicate Files Cannot Be Uploaded",
preventDuplicates: true,
and add one more prototype function and re-implement your dropzone addFileprototype function above dropzone initialization like this:
并添加一个原型函数并addFile在 dropzone 初始化之上重新实现你的 dropzone原型函数，如下所示：
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));
};
You can also modify your drozone file if you want.
如果需要，您还可以修改 drozone 文件。
回答by Sergio
I'm checking from the server if the file is duplicate and then returning the error to dropzone,ee below:
我正在从服务器检查文件是否重复，然后将错误返回给 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);
}
回答by from Russia with love
The following solution helped me:
以下解决方案帮助了我：
this.on('addedfile', function(file) {
setTimeout(function() {
$(".dz-file-preview").remove(); // removes all files except images
}, 3000);
});
