Dropzone.js-如何在上传到文件夹之前更改文件名 [英] Dropzone.js - How to change file name before uploading to folder
问题描述
我正在使用 DropzoneJS 脚本通过拖放操作上传图像.删除，但是现在我正在寻找一种在上传到服务器文件夹之前如何使用文件名添加当前时间戳的解决方案，因为如果文件已经存在于该文件夹中，那么我将无法上传同一张图片.
I am using DropzoneJS script for uploading images with drag & drop, but now I'm looking for a solution for how to add current timestamps with file name before uploading to the server folder, because I am not able to upload the same image if the file already exists in the folder.
我还在下面提到了stackoverflow链接，但是我很困惑在哪里实现.
I have also referred below stackoverflow link but I'm confused where to implement this.
- https://stackoverflow.com/a/23805488/3113858
- https://stackoverflow.com/a/19432731/3113858
以下是 dropzone.js脚本供参考
推荐答案
请检查以下我使用PHP实现的代码.
Please check following code I have implemented using PHP.
在索引文件
$(document).ready(function() {
Dropzone.autoDiscover = false;
var fileList = new Array;
var i =0;
$("#some-dropzone").dropzone({
addRemoveLinks: true,
init: function() {
// Hack: Add the dropzone class to the element
$(this.element).addClass("dropzone");
this.on("success", function(file, serverFileName) {
fileList[i] = {"serverFileName" : serverFileName, "fileName" : file.name,"fileId" : i };
//console.log(fileList);
i++;
});
this.on("removedfile", function(file) {
var rmvFile = "";
for(f=0;f<fileList.length;f++){
if(fileList[f].fileName == file.name)
{
rmvFile = fileList[f].serverFileName;
}
}
if (rmvFile){
$.ajax({
url: "http://localhost/dropzone/sample/delete_temp_files.php",
type: "POST",
data: { "fileList" : rmvFile }
});
}
});
},
url: "http://localhost/dropzone/sample/upload.php"
});
});
Upload.php
<?php
$ds = DIRECTORY_SEPARATOR; // Store directory separator (DIRECTORY_SEPARATOR) to a simple variable. This is just a personal preference as we hate to type long variable name.
$storeFolder = 'uploads'; // Declare a variable for destination folder.
if (!empty($_FILES)) {
$tempFile = $_FILES['file']['tmp_name']; // If file is sent to the page, store the file object to a temporary variable.
$targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds; // Create the absolute path of the destination folder.
// Adding timestamp with image's name so that files with same name can be uploaded easily.
$date = new DateTime();
$newFileName = $date->getTimestamp().$_FILES['file']['name'];
$targetFile = $targetPath.$newFileName; // Create the absolute path of the uploaded file destination.
move_uploaded_file($tempFile,$targetFile); // Move uploaded file to destination.
echo $newFileName;
}
?>
delete_temp_files.php
<?php
$ds = DIRECTORY_SEPARATOR; // Store directory separator (DIRECTORY_SEPARATOR) to a simple variable. This is just a personal preference as we hate to type long variable name.
$storeFolder = 'uploads';
$fileList = $_POST['fileList'];
$targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds;
if(isset($fileList)){
unlink($targetPath.$fileList);
}
?>
希望这对于使用ajax上传图像并使用ajax删除图片很有帮助:)
Hope this will be helpful for uploading images using ajax and delete using ajax :)
我从以下参考文献中找到了
I have found from following references:
Dropzone.js-如何从中删除文件服务器? Dropzone.js使用php删除按钮
还请在第1110行之后的dropzone.js文件中添加以下代码，以防止用户上传具有相同名称的重复文件:)
Also add following code in your dropzone.js file after line #1110 for preventing user to upload duplicate files with same name :)
Dropzone.prototype.addFile = function(file) {
if (this.files.length) {
var _i, _len;
for (_i = 0, _len = this.files.length; _i < _len; _i++) {
if(this.files[_i].name === file.name && this.files[_i].size === file.size) {
return false;
}
}
}
这篇关于Dropzone.js-如何在上传到文件夹之前更改文件名的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
