文件上傳和下載

什麼是文件上傳?

文件上傳就是把用戶的信息保存起來。javascript

爲何須要文件上傳?

在用戶註冊的時候,可能須要用戶提交照片。那麼這張照片就應該要進行保存。java

上傳組件(工具)

爲何咱們要使用上傳工具?

爲啥咱們須要上傳組件呢?當咱們要獲取客戶端的數據,咱們通常是經過getParameter()方法來獲取的。算法

上傳文件數據是通過MIME協議進行分割的,表單進行了二進制封裝。也就是說:getParameter()沒法獲取獲得上傳文件的數據。瀏覽器

咱們首先來看看文件上傳http是怎麼把數據帶過去的安全

  • jsp頁面,表單必定要指定enctype:multipart/form-data
<form action="${pageContext.request.contextPath }/servlet/UploadServlet1" enctype="multipart/form-data" method="post">
        上傳用戶:<input type="text" name="username"><br/>
        上傳文件1:<input type="file" name="file1"><br/>
        上傳文件2:<input type="file" name="file2"><br/>
        <input type="submit" value="提交">
    </form>
  • http抓包

這裏寫圖片描述

  • 嘗試在Servlet上使用getParameter()獲取數據
 String ss = request.getParameter("username"); System.out.println(ss);
  • 直接使用getParameter是獲取不到數據的。

這裏寫圖片描述

那麼咱們要怎麼辦呢????request對象提供了ServletInputStream流給咱們讀取數據服務器

  • 咱們試着讀取下文件
ServletInputStream inputStream = request.getInputStream();

        byte[] bytes = new byte[1024];
        int len = 0;

        while ((len = inputStream.read(bytes)) > 0) {
            System.out.println(new String(bytes, 0, len));
        }
  • 在jsp頁面多增添一個input控件
<input type="text" name="password">
  • 我上傳的文本文件內容就是111111,讀取效果以下:

這裏寫圖片描述

如今咱們可以讀取上傳文件的數據了,可是如今問題又來了:怎麼把文件上傳個數據和普通傳送給服務器的數據分割開來呢???上面在圖上咱們已經看到了,他們是混合在一塊兒的。markdown

按咱們日常的作法是很難分割開來的,因此咱們須要上傳組件app


上傳組件有兩種

  • FileUpload【操做比較複雜】
  • SamrtUpload【操做比較簡單】

FileUpload

要使用FileUpload組件,就須要導入兩個jar包dom

  • commons-io
  • Commons-fileupload

開發步驟

  • 建立解析器工廠對象【DiskFileItemFactory】
  • 經過解析器工廠建立解析器【ServletFileUpload】
  • 調用解析器方法解析request對象,獲得全部上傳的內容【list】
  • 遍歷list,判斷每一個對象是不是上傳文件
    • 若是是普通表單字段,獲得字段名和字段值
    • 若是是上傳文件,調用InputSteam方法獲得輸入流,讀取上傳的數據

快速入門

 try{ //1.獲得解析器工廠 DiskFileItemFactory factory = new DiskFileItemFactory(); //2.獲得解析器 ServletFileUpload upload = new ServletFileUpload(factory); //3.判斷上傳表單的類型 if(!upload.isMultipartContent(request)){ //上傳表單爲普通表單,則按照傳統方式獲取數據便可 return; } //爲上傳表單,則調用解析器解析上傳數據 List<FileItem> list = upload.parseRequest(request); //FileItem //遍歷list,獲得用於封裝第一個上傳輸入項數據fileItem對象 for(FileItem item : list){ if(item.isFormField()){ //獲得的是普通輸入項 String name = item.getFieldName(); //獲得輸入項的名稱 String value = item.getString(); System.out.println(name + "=" + value); }else{ //獲得上傳輸入項 String filename = item.getName(); //獲得上傳文件名 C:\Documents and Settings\ThinkPad\桌面\1.txt filename = filename.substring(filename.lastIndexOf("\\")+1); InputStream in = item.getInputStream(); //獲得上傳數據 int len = 0; byte buffer[]= new byte[1024]; String savepath = this.getServletContext().getRealPath("/upload"); FileOutputStream out = new FileOutputStream(savepath + "\\" + filename); //向upload目錄中寫入文件 while((len=in.read(buffer))>0){ out.write(buffer, 0, len); } in.close(); out.close(); } } }catch (Exception e) { e.printStackTrace(); }

測試

  • 普通的字段和上傳的文件都能讀取獲得了!

這裏寫圖片描述


SmartUpload

要使用SmartUpload組件,就須要導入smartupload.jar開發包jsp

快速入門

 //實例化組件 SmartUpload smartUpload = new SmartUpload(); //初始化上傳操做 smartUpload.initialize(this.getServletConfig(), request, response); try { //上傳準備 smartUpload.upload(); //對於普通數據,單純到request對象是沒法獲取獲得提交參數的。也是須要依賴smartUpload String password = smartUpload.getRequest().getParameter("password"); System.out.println(password); //上傳到uploadFile文件夾中 smartUpload.save("uploadFile"); } catch (SmartUploadException e) { e.printStackTrace(); } 

測試

一樣地,咱們能夠上傳文件到uploadFile文件夾中。代碼量也的確減小不少!

也可以獲取普通字段的參數

這裏寫圖片描述


上傳文件名的中文亂碼和上傳數據的中文亂碼

  • 我把文件名改爲中文,就亂碼了

這裏寫圖片描述

  • 表單提交過來的中文數據也亂碼了

這裏寫圖片描述

上面已經說了,上傳文件的數據的表單進行了二進制封裝,因此使用request對數據編碼編碼,對於表單提交過來的數據是不奏效的!

FileUpload解決亂碼

使用FileUpload解決亂碼問題是十分簡單的

  • 解決中文文件名亂碼,獲得解析器之後,就直接設置解析器的編碼爲UTF-8就好了!
 //設置upload的編碼 fileUpload.setHeaderEncoding("UTF-8"); 
  • 解決表單數據亂碼,在獲取表單值的時候,按照UTF-8編碼來獲取
String value = fileItem.getString("UTF-8");

效果:

這裏寫圖片描述


SmartUpload解決亂碼

這個組件解決亂碼問題有點麻煩,在網上找了各類辦法也沒找到簡單的……

因此,若是數據不涉及到中文就使用SmartUpload組件,涉及到中文數據就使用FileUpload組件吧!


多個文件上傳,動態添加上傳控件

假設我如今有多個文件要上傳,並且要上傳的個數是不肯定的。那麼咱們要怎麼辦呢???

咱們不可能列出不少不少個上傳文件的控件在頁面上,這樣不美觀。若是用戶用不到那麼多個控件,也浪費呀。

因此,咱們想要動態地增添上傳文件的控件,若是用戶還想要上傳文件,只須要動態地生成控件出來便可!

分析

要想在頁面上動態地生成控件,無非就是使用JavaScript代碼。

那麼咱們要怎麼作呢??

這樣子吧:當用戶想要上傳文件的時候,就點擊按鈕,按鈕綁定事件,生成文件上傳的控件

爲了作得更加完善,每當生成了文件上傳的控件,也提供一個刪除按鈕,刪除該控件!

咱們應該使用div裝載着咱們要生成的控件和刪除按鈕,而用戶點擊刪除的時候,應該是要把刪除按鈕和文件上傳控件都一塊兒隱藏起來的。因此,最好就是使用嵌套div

代碼

  • 頁面代碼:
<table border="1px"> <tr> <td>上傳用戶:</td> <td><input type="text" name="username"></td> </tr> <tr> <td>添加上傳文件</td> <td><input type="button" value="添加上傳文件" onclick="addUploadFile()"> </td> </tr> <tr> <td> <div id="file"> </div> </td> </tr> </table> 
  • javaScript代碼
<script type="text/javascript"> function addUploadFile() { //生成文件上傳控件 var input = document.createElement("input"); input.type = 'file'; input.name = 'fileName'; //生成刪除按鈕 var del = document.createElement("input"); del.type = 'button'; del.value = '刪除'; //生成內部的div var innerDiv = document.createElement("div"); //將兩個控件綁定到內部div上 innerDiv.appendChild(input); innerDiv.appendChild(del); //獲得外部div控件,並將內部div綁定到外部div上 var outterDiv = document.getElementById("file"); outterDiv.appendChild(innerDiv); //爲刪除按鈕綁定事件 del.onclick = function dele() { //調用外界div的remove方法把內部的div幹掉 this.parentNode.parentNode.removeChild(this.parentNode); } } </script>

文件上傳細節

  • 若是上傳文件的大小大於咱們設定文件的大小,那麼文件在上傳的時候會使用臨時文件保存上傳數據。在上傳完畢後,咱們應該刪除臨時文件
  • 上傳文件的位置是不能在WEB服務器管理之下的,不然可能形成安全問題【其餘人有可能經過手段來修改上傳文件】
  • 若是上傳文件名相同,那麼就會把本來的上傳文件覆蓋掉。咱們要生成一個獨一無二的文件名。
  • 若是用戶量很大,上傳文件很是多。那麼咱們不該該在一個目錄保存全部的上傳文件,這樣極可能形成磁盤奔潰了。因此咱們要把上傳的文件打散到不一樣的目錄下

分析

刪除臨時文件問題是很是簡單的,只須要在全部的操做完畢以後,調用FileItem的delete()方法便可

讓上傳文件的位置不能在WEB服務器管理之下,咱們把上傳文件的位置放到WEB-INF/目錄下便可!

文件名相同的問題,咱們能夠使用UUID+用戶上傳的文件名來做爲咱們保存上傳文件名。這樣的文件名就是獨一無二的了。

要將上傳的文件進行打散,那麼咱們須要使用HashCode算法來進行打散

  • 低四位生成一級目錄
  • 5-8位生成二級目錄

代碼

下面咱們寫一個比較完善的上傳文件代碼

  • 使用hashCode算法來打散保存的目錄
private String makeDirPath(String fileName, String path) {

        //經過文件名來算出一級目錄和二級目錄
        int hashCode = fileName.hashCode();
        int dir1 = hashCode & 0xf;
        int dir2 = (hashCode & 0xf0) >> 4;

        String dir = path + "\\" + dir1 + "\\" + dir2;

        //若是該目錄不存在,就建立目錄
        File file = new File(dir);
        if (!file.exists()) {

            file.mkdirs();
        }
        //返回全路徑
        return dir;

    }
  • 生成獨一無二的文件名
 private String makeFileName(String fileName) { //使用下劃線把UUID和文件名分割開來,後面可能會解析文件名的。 return UUID.randomUUID().toString() + "_"+ fileName; }
  • 上傳的代碼
 //建立工廠 DiskFileItemFactory factory = new DiskFileItemFactory(); //經過工廠建立解析器 ServletFileUpload fileUpload = new ServletFileUpload(factory); //設置upload的編碼 fileUpload.setHeaderEncoding("UTF-8"); //判斷上傳表單的類型 if(!fileUpload.isMultipartContent(request)){ //上傳表單爲普通表單,則按照傳統方式獲取數據便可 return; } try { //解析request對象,獲得List【裝載着上傳的所有內容】 List<FileItem> list = fileUpload.parseRequest(request); //遍歷List,判斷裝載的內容是普通字段仍是上傳文件 for (FileItem fileItem : list) { //若是是普通輸入項 if (fileItem.isFormField()) { //獲得輸入項的名稱和值 String name = fileItem.getFieldName(); String value = fileItem.getString("UTF-8"); System.out.println(name + " = " + value); } else { //若是是上傳文件 //獲得上傳名稱【包括路徑名】 String fileName = fileItem.getName(); //截取文件名 fileName = fileName.substring(fileName.lastIndexOf("\\") + 1); //生成獨一無二的文件名 fileName = makeFileName(fileName); InputStream inputStream = fileItem.getInputStream(); //獲得項目的路徑,把上傳文件寫到項目中 String path = this.getServletContext().getRealPath("/WEB-INF/uploadFile"); //獲得分散後的目錄路徑 String realPath = makeDirPath(fileName, path); FileOutputStream outputStream = new FileOutputStream(realPath + "\\" + fileName); byte[] bytes = new byte[1024]; int len = 0; while ((len = inputStream.read(bytes)) > 0) { outputStream.write(bytes, 0, len); } inputStream.close(); outputStream.close(); //刪除臨時文件的數據 fileItem.delete(); } } } catch (FileUploadException e) { e.printStackTrace(); } 

效果:

  • 成功把目錄打散,文件名也是獨一無二的了。

這裏寫圖片描述


列出上傳目錄下的文件,提供下載

在講解respose對象的時候已經講解過文件下載了。此次咱們就直接寫一個小案例來鞏固文件下載把。

  • 上傳目錄下的文件有3個

這裏寫圖片描述

分析

首先,要把目錄下的文件都列出來。因爲後面要根據文件名對文件進行下載,因此咱們用一個Map集合來保存全部的文件

下載文件部分也很簡單,根據文件名和上傳文件位置找到對應的文件,對其進行讀寫,而後修改消息頭實現下載就行了。

代碼

  • 將存放在WEB-INF/目錄下的文件所有放在Map集合中
 protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //獲得上傳文件的目錄 String filePath = this.getServletContext().getRealPath("/WEB-INF/uploadFile"); Map map = new HashMap(); //使用遞歸來獲得全部的文件,並添加到Map集合中 getAllFiles(new File(filePath), map); request.setAttribute("map", map); request.getRequestDispatcher("/listFile.jsp").forward(request, response); } private void getAllFiles(File filePath, Map map) { //若是不是文件,那麼它就是文件夾 if (!filePath.isFile()) { //列出文件夾下全部的文件(多是文件,多是文件夾) File[] files = filePath.listFiles(); for (File file : files) { //獲得的文件(或者是文件夾)再對其進行判斷 getAllFiles(file, map); } } else { //進入到else語句了,確定是文件了 //獲得文件名 String fileName = filePath.getName().substring(filePath.getName().lastIndexOf("_") + 1); //咱們將文件全名做爲key,文件名做爲value保存在map集合中 map.put(filePath.getName(), fileName); } } 
  • 在JSP頁面中顯示能夠下載的文件
 <c:forEach items="${map}" var="me"> <c:url var="url" value="/DownFileServlet"> <c:param name="fileName" value="${me.key}"></c:param> </c:url> ${me.value}<a href="${url}">下載!</a><br> </c:forEach>
  • 實現下載的Servlet
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        //獲得文件的全名
        String fileName = request.getParameter("fileName");

        //若是是中文數據,須要轉碼。
        fileName = new String(fileName.getBytes("ISO8859-1"), "utf-8");

        //獲得保存文件的位置
        String path = this.getServletContext().getRealPath("/WEB-INF/uploadFile");

        //文件是經過文件名進行hashCode打散保存的,經過文件名拿到文件絕對路徑
        String fileRealPath = makeFilePath(fileName, path);
        System.out.println(fileRealPath);

        //判斷文件是否存在
        File file = new File(fileRealPath);
        if (!file.exists()) {
            request.setAttribute("message", "您要下載的資源不存在了!");
            request.getRequestDispatcher("/message.jsp").forward(request, response);
            return ;
        }

        //存在

        //讀取該文件並把數據寫給瀏覽器
        FileInputStream inputStream = new FileInputStream(fileRealPath);
        byte[] bytes = new byte[1024];
        int len = 0;
        while ((len = inputStream.read(bytes)) > 0) {
            response.getOutputStream().write(bytes, 0, len);
        }

        inputStream.close();


        //設置消息頭,告訴瀏覽器,這是下載的文件
        String name = fileName.substring(fileName.lastIndexOf("_") + 1);
        response.setHeader("content-disposition","attachment;filename=" + URLEncoder.encode(name, "UTF-8"));

    }

    private String makeFilePath(String fileName, String path) {

        int hashCode = fileName.hashCode();

        int dir1 = hashCode & 0xf;
        int dir2 = (hashCode & 0xf0) >> 4;

        String dir = path + "\\" + dir1 + "\\" + dir2 +"\\"+ fileName;
        return dir;
    }

效果

這裏寫圖片描述

相關文章
相關標籤/搜索