Мне действительно нужно идентифицировать файлы во внешнем интерфейсе по уникальному идентификатору, чтобы избежать проблем, когда пользователь загружает два файла с одинаковым именем. Это прекрасно работает, когда я использую один файл, "datetime_filename.extention", который отлично.
Однако, если я переместил строку переименования в свойство RenameFile, при отбрасывании файла генерируется новая дата, которая имеет логическое значение c, но это вызывает некоторые проблемы (когда я вызываю метод remove, файл быть удаленным всегда идет с последней датой, которая неправильна, если я удаляю какой-то старый файл
Некоторые люди говорят мне, чтобы я сделал словарь, другие - для работы с массивом файлов, но я не совсем уверен, как это сделать.
Есть идеи? (Я знаю, что есть некоторые простые исправления с PHP, но мы не можем его использовать).
СЦЕНАРИЙ:
$(document).ready(function () {
let newname = new Date().getTime() + '_';
var x = null;
Dropzone.autoDiscover = false;
const Drop2 = new Dropzone("div#myAwesomeDropzone", {url: "/Article/UploadFiles",
paramName: "file",
maxFiles: 6,
maxFilesize: 1200,
maxFileHeight: 840,
maxFileWidth: 840,
acceptedFiles: "image/*",
addRemoveLinks: true,
parallelUploads: 6,
renameFile: function (file) {
//let newname = new Date().getTime() + '_'; //FUUUUUUUUUUUUUUUUUUUUUUUUUUUU
x = new File([file], newname + file.name);
return x.name;
},
init: function () {
this.on("sending", function (file, xhr, formData) {
if (file.name.length > 100) {
alert("Filename cant have more than 12 characters ");
this.removeFile(file);
var fs2 = new FormData();
fs2.append('file', x);
fs2.append('fileguid', '@Model.ImageGuid');
$.ajax({
type: 'POST',
url: '@Url.Action("Remove")',
data: fs2,
processData: false,
contentType: false
});
}
this.on("thumbnail", function (file) {
if ((file.height > this.options.maxFileHeight && file.width > this.options.maxFileWidth) || (file.height > this.options.maxFileHeight) || (file.width > this.options.maxFileWidth))
{
alert("Image max size allowed is 840 x 840");
this.removeFile(file);
var fs1 = new FormData();
fs1.append('file', x);
fs1.append('fileguid', '@Model.ImageGuid');
$.ajax({
type: 'POST',
url: '@Url.Action("Remove")',
data: fs1,
processData: false,
contentType: false
});
}
});
this.on("maxfilesexceeded", function (file) {
alert("The maximum amount of files was exceeded");
this.removeFile(file);
var fs3 = new FormData();
fs3.append('file', x);
fs3.append('fileguid', '@Model.ImageGuid');
$.ajax({
type: 'POST',
url: '@Url.Action("Remove")',
data: fs3,
processData: false,
contentType: false
});
});
formData.append("file", x);
formData.append("fileguid", '@Model.ImageGuid');
});
this.on("removedfile", function (file) {
if (file.status == 'success') {
var fd = new FormData();
fd.append('file', x);
fd.append('fileguid', '@Model.ImageGuid');
$.ajax({
type: 'POST',
url: '@Url.Action("Remove")',
data: fd,
processData: false,
contentType: false
});
}
});
}
});
});
HTML:
<div style="font: 1.1em 'Source Sans Pro';">
<div class="wrapper" style="width: 100%; max-width: 600px; margin: 0 auto;">
<div class="upload-console">
<div class="upload-console-body">
<div class="upload-console-drop">
<div class="dropzone-previews" style="border-style:dashed; border-color:#29d; border-radius: 5px;">
<div class="dropzone" id="myAwesomeDropzone" style="border: none;" enctype="multipart/form-data">
<div class="dz-default dz-message" style="background-image: none;">
<img src="~/Areas/PalermoContents/Icons/cloud.png" style="cursor: pointer !important; width: 216px; height: 144px;" />
<br />
<span class="upload-console-header" style="font:weight:bold; font-size:26px; color:#646C7F;">Drag and Drop Images:</span>
<br />
<span style="color:rgb(133,133,133)"> Drop images here or click to Upload.</span>
<br />
<img src="~/Areas/PalermoContents/Icons/browse-btn.png" style="cursor: pointer !important; margin-top: 10px;" />
</div>
</div>
</div>
<div style="text-align: center;">
<p style="font-size: 14px; font-weight: bold; margin: 5px 0 0 0; color:#646C7F"> Maximum upload image size: <b>1000MB.</b></p>
<p style="font-size: 14px; font-weight: bold; margin: 5px 0 0 0; color:#646C7F"> Maximum Quantity per images Upload: <b>10.</b></p>
<p style="font-size: 14px; font-weight: bold; margin: 5px 0 0 0; color:#646C7F"> Supported images Type:</p>
<p style="font-family: Arial; font-size: 10px; margin: 5px 5px 5px 5px; color:rgb(133,133,133)"> (.PNG,.JPG,.GIF,.JPEG) </p>
</div>
</div>
</div>
</div>
</div>
</div>