html5文件夹(包含子文件夹)上传代码,前端html5,后端php,原文件夹及子文件夹目录完整上传
核心思想就是利用火狐和chrome的文件夹上传特性,在上传前将每个文件的路径信息遍历一下,放进一个数组对象中,然后json序列化传给后端php,后端php先将所有文件放进存进临时目录后,根据前端传过来的目录结构数据创建原始文件夹的结构,最后将数据又返回到各个目录中,这样就还原了原始目录,实现了文件夹(包括子文件夹)所有文件的上传
先上前端html和js代码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>BFW NEW PAGE</title> <script id="bfwone" data="dep=jquery.17" type="text/BfwJavascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script> <script type="text/BfwJavascript"> var filetree = {}; function checkfile() { console.log(filetree); //将文件结构json序列化传给后端php $("#filetree").val(JSON.stringify(filetree)); return true; } bready(function() { $("#filebro").change(function() { for (var i = 0; i < this.files.length; i++) { //防止不同文件夹中相同文件重复 var filekey = this.files[i].name+this.files[i].size.toString(); filetree[filekey] = this.files[i].webkitRelativePath; } }); }); </script> </head> <body> <form method="post" action="upload.php" enctype="multipart/form-data" BfwOnsubmit="return checkfile();"> <input id="filebro" type="file" name="files[]" id="files" multiple="" directory="" webkitdirectory="" mozdirectory=""> <input class="button" type="submit" value="Upload" /> <input type="hidden" name="filetree" id="filetree" /> </form> </body> </html>后端代码如下
<?php function createFolder($foldername) { $folders = explode("/", $foldername); $path = 'upload'; $nFolders = count($folders); for ($i = 0; $i < $nFolders; $i ++) { $newFolder = '/' . $folders[$i]; $path .= $newFolder; if (! file_exists($path) && ! is_dir($path)) { mkdir($path); } } } $count = 0; $_file_temp_info = []; if ($_SERVER['REQUEST_METHOD'] == 'POST') { foreach ($_FILES['files']['name'] as $i => $name) { if (strlen($_FILES['files']['name'][$i]) > 1) { $_file_temp_info[$name . $_FILES['files']['size'][$i]] = 'upload/test/' . $name; // var_dump($name); if (move_uploaded_file($_FILES['files']['tmp_name'][$i], 'upload/test/' . $name)) { $count ++; } } } } $_filetree = $_POST['filetree']; $_file_treearr = json_decode($_filetree, true); foreach ($_file_treearr as $key => $val) { if (isset($_file_temp_info[$key])) { $this->createFolder(dirname($val)); rename($_file_temp_info[$key], "upload/" . $val); } } echo $count."个文件上传完成"; ?>注意php默认最多上传20个文件,你可以修改php.ini下的max_file_uploads:20
网友评论0