Form上传多图片

时间：2025-03-22 07:16:30
<span style="white-space:pre">  </span> /** 
     * 获取多个文件，，注意问题：<br> 
     * 1.表单无需属性enctype="multipart/form-data"<br> 
     * 2.前台使用XMLHttpRequest对象或ajax发送数据<br> 
     * 3.前台使用FormData对象获取多个文件 
     * @param request 
     * @return 
     * @throws Exception 
     */  
    @RequestMapping("/multi/")  
    public String save(HttpServletRequest request) throws Exception{  
        //转为MultipartHttpServletRequest  
        MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;  
        //获取所有的文件  
        Map map = ();  
        MultipartFile multipartFile = null;  
        for (Iterator i = ().iterator(); ();) {  
            DemoMultiPhoto photo = new DemoMultiPhoto();  
            Object obj = ();  
            multipartFile = (MultipartFile) (obj);  
            //获取文件名称  
            String fileName = ();  
            //获取文件内容，二进制传送过来的  
            byte[] content = ();  
              
            (fileName);  
            (content);  
            (photo);  
        }  
        return "multiFile";  
    }  
      
      
    /** 
     * 只能获取单个文件(其他文件被覆盖)，注意问题：<br> 
     * 1.表单属性enctype="multipart/form-data"，二进制流传送数据<br> 
     * 2.表单文件控件必须有name属性<br> 
     * 3.后台接受文件控件时，类型不是String，而是{@link MultipartFile}，否则接受数据为null<br> 
     * 转为MultipartHttpServletRequest，否则接受数据为null<br> 
     * 5.只能获取一个文件，其他文件被覆盖(key不能重复) 
     * @param request  
     * @param name 
     * @param ph 对象必须为{@link MultipartFile} 
     * @return 
     * @throws Exception 
     */  
    @RequestMapping("/multi/")  
    public String save2(HttpServletRequest request, String name, MultipartFile ph) throws Exception{  
        //转为MultipartHttpServletRequest  
        MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;  
        //遍历上传的多文件，其map的Key值是file控件的name属性，所以只能保存单个文件(key不重复，被覆盖)  
        Map map = ();  
        MultipartFile multipartFile = null;  
        for (Iterator i = ().iterator(); ();) {  
            DemoMultiPhoto photo = new DemoMultiPhoto();  
            Object obj = ();  
            multipartFile = (MultipartFile) (obj);  
            //获取文件名称  
            String fileName = ();  
            //获取文件内容，二进制传送过来的  
            byte[] content = ();  
              
            (fileName);  
            (content);  
            (photo);  
        }  
        return "multiFile";  
    }

对应JSP：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="utf-8"%>  
<!DOCTYPE html>  
<html>  
  <head>  
    <jsp:include page="" flush="true"></jsp:include>  
    <title>MultiFile 多图片上传</title>  
    <meta charset="utf-8">  
    <script type="text/javascript">  
        function upload(){  
            var xhr = new XMLHttpRequest();  
            var form = new FormData();  
            var files = ("file2").files;  
            var name = $("#name2").val();  
            ("name",name);  
            for(var i=0; i< ; i++){  
                (files[i].name,files[i]);  
            }  
            ("POST","<%=()%>/multi/");  
            (form);  
        }  
    </script>  
  </head>  
  <body>  
        <form  action="javascript:upload();" method="post">  
            <label>用户：</label>  
            <input type="text"  style="border:2px solid red;" name="name"/><br>  
            <label>图片：</label>  
            <input type="file"  multiple="multiple" style="border:2px solid red;" name="ph"/>  
            <p class="help-block">支持jpg、jpeg、png、gif格式，大小不超过5.0M</p>  
            <button type="submit" style="border: 2px solid red;">上传1</button>  
        </form>  
          
        <form  action="<%=()%>/multi/" method="post" enctype="multipart/form-data">  
            <label>用户：</label>  
            <input type="text"  style="border:2px solid red;" name="name"/><br>  
            <label>图片：</label>  
            <input type="file"  multiple="multiple" style="border:2px solid red;" name="ph"/>  
            <p class="help-block">支持jpg、jpeg、png、gif格式，大小不超过5.0M</p>  
            <button type="submit" style="border: 2px solid red;">上传2</button>  
        </form>  
  </body>  
</html>


相关文章