我們平時經常做的是上傳文件,上傳文件夾與上傳文件類似,但也有一些不同之處,這次做了上傳文件夾就記錄下以備后用。
首先我們需要了解的是上傳文件三要素:
1.表單提交方式:post (get方式提交有大小限制,post沒有)
2.表單的enctype屬性:必須設置為multipart/form-data.
3.表單必須有文件上傳項:file,且文件項需要給定name值
上傳文件夾需要增加一個屬性webkitdirectory,像這樣:
<input id="fileFolder" name="fileFolder" type="file" webkitdirectory>
js中可以判斷文件夾中文件數量及文件夾大小是否符合要求,不符合要求不能向后台提交:
前台HTML模板
選擇文件,選擇文件夾,粘貼文件和文件夾的邏輯
后台在接收文件夾時不同之處在需要用MultipartHttpServletRequest
server端的包和類
f_post.jsp頁面的處理邏輯
生成文件名稱的邏輯
以下是service層做的處理:
整體模塊划分如下:
其中數據類實體邏輯處理如下
后台數據庫中的邏輯基本上都用到了上面的實體類
文件數據表操作類如下
實現后的整體效果如下
文件夾上傳完后的效果
服務器保存的文件夾數據,而且層級結構與本地客戶端是一致的。這在OA系統中,或者網盤系統中使用時是非常有用的
后端代碼邏輯大部分是相同的,目前能夠支持MySQL,Oracle,SQL。在使用前需要配置一下數據庫,可以參考我寫的這篇文章:http://blog.ncmem.com/wordpress/2019/08/12/java-http%E5%A4%A7%E6%96%87%E4%BB%B6%E6%96%AD%E7%82%B9%E7%BB%AD%E4%BC%A0%E4%B8%8A%E4%BC%A0/