commons-fileupload完成文件上传

时间 2019-11-08

标签 commons fileupload 完成文件上传繁體版

原文原文链接

环境资源javascript

　　Apache的commons-fileupload工具jar包html

案例需求描述前端

　页面展现上传文件窗口及确认按钮java

　　　　提供新建及删除上传窗口功能，支持多文件上传
apache

支持文件分离后端

解决文件重名服务器

解决思路及知识点app

设置一个form表单，设置请求方式为post，设置enctype="multipart/form-data" 用来提示当前是文件上传请求
form表单内添加属性为file的input标签，提供文件上传
动态建立新建及删除上传窗口按钮
后端接受上传数据，解析并存储到服务器目录下

代码实现(暂不实现目录分离)ide

　　前端页面工具

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<c:set var="root" value="${pageContext.request.contextPath}"/>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
   
    <script type="text/javascript">
        function _addInput(){
            //建立一个input type file ，添加文件上传
            var _input = document.createElement("input");
            _input.setAttribute("type", "file");
            _input.setAttribute("name", "upload");
            
            //获取div，获取到input插入的位置
            var _div = document.getElementById("_un");
            _div.appendChild(_input);
            //建立删除按钮，插入到div中
            var _delete = document.createElement("input");
            _delete.setAttribute("type", "button");
            _delete.setAttribute("value", "删除");
            
            _delete.onclick = function(){
                //删除多余的文件上传
                var _f = this.parentNode;
                //删除input type file
                _f.removeChild(this.previousSibling);
                //删除换行符
                _f.removeChild(this.nextSibling);
                //自杀
                _f.removeChild(this);
            };
            
            _div.appendChild(_delete);
            
            //添加换行符
            var _br = document.createElement("br");
            _div.appendChild(_br);
            
        }
    </script>
  </head>
  
  <body>
  <!-- a)    提供一个按钮，用户点击一下，生成一个input  type=“file”的输入框 -->
  <input type="button" value="添加要上传的文件" onclick="_addInput();"><br>
   <form action="${pageContext.request.contextPath}/upload" method="post" enctype="multipart/form-data">
    选择要上传的文件：<input type="file" name="upload"><br>
    <div id="_un"></div>
    <input type="submit" value="确认上传">
    </form>
  </body>
</html>

View Code

　　后台

package com.learn.upload;

import java.io.File;  
import java.io.IOException;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;



/**
 * Servlet implementation class UpLoadServlet
 */

public class UpLoadServlet extends HttpServlet {

    /**
     * 
     */
    private static final long serialVersionUID = 1L;

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("UTF-8");
        DiskFileItemFactory factory = new DiskFileItemFactory();
        ServletFileUpload upload = new ServletFileUpload(factory);
        try {
            List<FileItem> list = upload.parseRequest(request);
            for (FileItem fileItem : list) {
                if(fileItem.isFormField()){
                    System.out.println(fileItem.getName());
                    System.out.println(fileItem.getString());
                }else{
                    String realPath="C:\\Users\\星星\\Desktop\\";
                    File file1= new File(realPath+"upload");
                    file1.mkdir();
                    System.out.println("realPath:"+realPath);
                    String fileName=fileItem.getName();
                    long currentTimeMillis = System.currentTimeMillis();
                    String fileNameDiff=currentTimeMillis+fileName;
                    File file = new File(file1,fileNameDiff);
                    try {
                        fileItem.write(file);
                    } catch (Exception e) {
                        e.printStackTrace();
                    }
                }
            }
        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        doGet(request, response);
    }

}

View Code

　　目录分离思路

1. 每个用户有一个专属的文件夹
2. 每个用户一个专属文件夹的基础上，天天生成一个文件夹，用来存当天上传的文件先是有一个张三专属的文件夹，而后，天天建立一个当前的文件夹，专门用来存储，当天上传的文件。

效果展现

　　前端按钮

　　　上传后的效果