maven工程 java 实现文件上传 SSM ajax异步请求上传

java ssm框架实现文件上传 

实现：单文件上传、多文件上传（单选和多选），并且用 ajax 异步刷新，在当前界面显示上传的文件

首先springmvc的配置文件要配置上传文件解析器：

 1 
 2         
 5             
 6             
 7                 209715200
 8             
 9             
10                 4096
11             
12         

 

其次在pom.xml中要配置两个上传文件的依赖

 1 
 2          
 3             commons-io
 4             commons-io
 5             2.4
 6           
 7           
 8           
 9             commons-fileupload
10             commons-fileupload
11             1.3.1
12           
13           
14           
15             org.apache.commons
16             commons-lang3
17             3.3.2
18           

 

单文件上传：

 1 /**
 2      * 单文件上传
 3      * @param file
 4      * @param request
 5      * @return
 6      * @throws IllegalStateException
 7      * @throws IOException
 8      * @throws JSONException
 9      */
10     public static String simUpload(MultipartFile file, HttpServletRequest request) 
11             throws IllegalStateException, IOException, JSONException{
12         
13         if(!file.isEmpty()){
14             String path = request.getSession().getServletContext().getRealPath("/upload");
15             //定义文件
16             File parent = new File(path);
17             if(!parent.exists()) parent.mkdirs();
18             
19             HashMap map = new HashMap();
20             
21             String oldName = file.getOriginalFilename();
22             
23             long size = file.getSize();
24             
25             //使用TmFileUtil文件上传工具获取文件的各种信息
26             //优化文件大小
27             String sizeString = TmFileUtil.countFileSize(size);
28             //获取文件后缀名
29             String ext = TmFileUtil.getExtNoPoint(oldName);
30             //随机重命名，10位时间字符串
31             String newFileName = TmFileUtil.generateFileName(oldName, 10, "yyyyMMddHHmmss");
32             
33             String url = "upload/"+newFileName;
34             
35             //文件传输，parent文件
36             file.transferTo(new File(parent, newFileName));
37             
38             map.put("oldname",oldName);//文件原名称
39             map.put("ext",ext);
40             map.put("size",sizeString);
41             map.put("name",newFileName);//文件新名称
42             map.put("url",url);
43             
44             //以json方式输出到页面
45             return JSONUtil.serialize(map);
46         }else{
47             return null;
48         }
49     }

 

多文件上传（整合了 单选文件和多选文件 的两种）

 1 /**
 2      * 多文件上传
 3      * @param files
 4      * @param request
 5      * @return
 6      * @throws IllegalStateException
 7      * @throws IOException
 8      * @throws JSONException
 9      */
10     public static List> mutlUpload(MultipartFile[] files, HttpServletRequest request) 
11             throws IllegalStateException, IOException, JSONException{
12         
13         if(files.length > 0){
14             String path = request.getSession().getServletContext().getRealPath("/upload");
15             //定义文件
16             File parent = new File(path);
17             if(!parent.exists()) parent.mkdirs();
18             
19             //创建这个集合保存所有文件的信息
20             List> listMap = new ArrayList>();
21             
22             //循环多次上传多个文件
23             for (MultipartFile file : files) {
24                 
25                 //创建map对象保存每一个文件的信息
26                 HashMap map = new HashMap();
27                 
28                 String oldName = file.getOriginalFilename();
29 
30                 long size = file.getSize();
31                 
32                 //使用TmFileUtil文件上传工具获取文件的各种信息
33                 //优化文件大小
34                 String sizeString = TmFileUtil.countFileSize(size);
35                 //获取文件后缀名
36                 String ext = TmFileUtil.getExtNoPoint(oldName);
37                 //随机重命名，10位时间字符串
38                 String newFileName = TmFileUtil.generateFileName(oldName, 10, "yyyyMMddHHmmss");
39                 
40                 String url = "upload/"+newFileName;
41                 
42                 //文件传输，parent文件
43                 file.transferTo(new File(parent, newFileName));
44                 
45                 map.put("oldname",oldName);//文件原名称
46                 map.put("ext",ext);
47                 map.put("size",sizeString);
48                 map.put("name",newFileName);//文件新名称
49                 map.put("url",url);
50                 
51                 listMap.add(map);
52             }
53             
54             //以json方式输出到页面
55             return listMap;
56         }else{
57             return null;
58         }
59     }

 

前端代码：

文件多选，实际上在

多加了一个 multiple 属性。

要想在当前界面显示上传的文件，而不跳转，就利用 ajax 异步请求：

不过需要注意的是，我这里使用 FormData() 储存文件对象， ajax 要配上这几个参数才可实现文件上传：

$.ajax({
　　type:"post",
　　data:form,  //FormData()对象
　　url:basePath+"/upload/mutl",
　　contentType: false, //必须false才会自动加上正确的Content-Type
　　processData: false, //必须false才会避开jQuery对 formdata 的默认处理     , XMLHttpRequest会对 formdata 进行正确的处理
　　success:function(data){

　　}

});

  1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2 <%
  3     String path = request.getContextPath();
  4     String basePath = request.getScheme()+"://"+request.getServerName()+path+"/";
  5     pageContext.setAttribute("basePath", basePath);
  6 %>
  7 
  8 
  9   
 10       
 11     
 12     
 13     
 14     
 62   
 63   
 64       

 65         
 66         

 67             
单个文件上传
 68             
 69             

 70                 
文件名：
 71                 
大小：
 72                 
文件格式：
 73                 
预览：
 74                 

 75                     预览图
 76                 
 77             
 78         
 79         
 80         
 81         

 82             
多文件上传（单选）
 83             
 84             
 85             
 86             
 87             
 88             

 89                 
 90                     
 91                         
 92                             
 93                             
 94                             
 95                         
 96                     
 97                     
 98                     
 99                 
文件预览
文件名
大小

100             
101         
102     
103           
104         

105             
多文件上传（多选）
106             
107             
108             

109                 
110                     
111                         
112                             
113                             
114                             
115                         
116                     
117                     
118                     
119                 
文件预览
文件名
大小

120             
121         
122           

123     
124       
125       
126     
127       
258   
259 

 

controller层调用：

 1 package com.krry.controller;
 2 
 3 import java.io.IOException;
 4 import java.util.HashMap;
 5 import java.util.List;
 6 
 7 import javax.servlet.http.HttpServletRequest;
 8 
 9 import org.apache.struts2.json.JSONException;
10 import org.springframework.stereotype.Controller;
11 import org.springframework.web.bind.annotation.RequestMapping;
12 import org.springframework.web.bind.annotation.RequestParam;
13 import org.springframework.web.bind.annotation.ResponseBody;
14 import org.springframework.web.multipart.MultipartFile;
15 
16 import com.krry.util.UploadUtil;
17 
18 /**
19  * 文件上传类
20  * KrryUploadController
21  * @author krry
22  * @version 1.0.0
23  *
24  */
25 @Controller
26 @RequestMapping("/upload")
27 public class KrryUploadController {
28     
29     /**
30      * 单文件上传
31      * @param file
32      * @param request
33      * @return
34      * @throws IllegalStateException
35      * @throws IOException
36      * @throws JSONException
37      */
38     @ResponseBody
39     @RequestMapping(value = "/file")
40     public String krryupload(@RequestParam("doc") MultipartFile file, HttpServletRequest request) throws IllegalStateException, IOException, JSONException{
41 
42         //调用工具类完成上传，返回相关数据到页面
43         return UploadUtil.simUpload(file, request);
44     }
45     
46     /**
47      * 多文件上传
48      * @param file
49      * @param request
50      * @return
51      * @throws IllegalStateException
52      * @throws IOException
53      * @throws JSONException
54      */
55     // 这里的MultipartFile[] file表示前端页面上传过来的多个文件，file对应页面中多个file类型的input标签的name，但框架只会将一个文件封装进一个MultipartFile对象，
56   // 并不会将多个文件封装进一个MultipartFile[]数组，直接使用会报[Lorg.springframework.web.multipart.MultipartFile;.()错误，
57   // 所以需要用@RequestParam校正参数（参数名与MultipartFile对象名一致），当然也可以这么写：@RequestParam("file") MultipartFile[] files。
58     @ResponseBody
59     @RequestMapping(value = "/mutl")
60     public List> krryuploadMutl(@RequestParam("doc") MultipartFile[] file, HttpServletRequest request) throws IllegalStateException, IOException, JSONException{
61         //调用工具类完成上传，返回相关数据到页面
62         return UploadUtil.mutlUpload(file, request);
63     }
64 }

 

到这里，完成 ajax异步请求文件上传 的功能。

附上优化文件大小的代码：

 1 /**
 2      * 将文件的字节数转换成文件的大小
 3      * com.krry.uitl 
 4      * 方法名：format
 5      * @author krry 
 6      * @param size
 7      * @return String
 8      * @exception 
 9      * @since  1.0.0
10      */
11     public static String format(long size){
12         float fsize = size;
13         String fileSizeString;
14         if (fsize < 1024) {
15             fileSizeString = String.format("%.2f", fsize) + "B"; //2f表示保留两位小数
16         } else if (fsize < 1048576) {
17             fileSizeString = String.format("%.2f", fsize/1024) + "KB";
18         } else if (fsize < 1073741824) {
19             fileSizeString = String.format("%.2f", fsize/1024/1024) + "MB";
20         } else if (fsize < 1024 * 1024 * 1024) {
21             fileSizeString = String.format("%.2f", fsize/1024/1024/1024) + "GB";
22         } else {
23             fileSizeString = "0B";
24         }
25         return fileSizeString;
26     }

转载于:https://www.cnblogs.com/SUNSHINEC/p/8571716.html