通过ajax上传文件

李永毅 2020-06-03

html前端代码(表单内的标签必须有name属性才可以被后台获取)
通过ajax上传文件
必须要在form标签中设置属性 ??enctype="multipart/form-data"

需要借助 FormData 对象

var formData = new FormData($("#form")[0]);

Ajax 代码

<script>
        function up() {
            var formData = new FormData($("#form")[0]);      //创建FormData对象
            if($("#file").val() == ""){           //判空
                alert("未选择文件");
                return ;
            }
            formData.append(‘img‘, $(‘#file‘)[0].files[0]) //把file添加进去  name命名为img      FormData.append(key,value);
            $.ajax({
                url: "/web02_war_exploded/img",      //发送的地址
                data: formData,            //发送的数据
                type: "post",              //发送的方式
                contentType: false,
                processData: false,        //序列化数据 默认为true(不序列化)
                success: function(data) {
                    alert("操作成功");
                },
                error: function() {
                    alert("操作失败");
                }
            })
        }
    </script>

后端代码

private Map<String, String> getParameters(HttpServletRequest request) {
        Map<String, String> params = new HashMap<>();
        try {
            DiskFileItemFactory factory = new DiskFileItemFactory();
            ServletFileUpload upload = new ServletFileUpload(factory);
            List<FileItem> items = upload.parseRequest(request);
            for (FileItem item : items) {
                if (item.isFormField()) {   //判断是否是普通的表单类型
                    params.put(item.getFieldName(), item.getString());
                }else{      //否则该表单是 File 型的
                    String fieldName = item.getFieldName(); //返回表单的name属性
                    String name = item.getName();   //返回文件的名称
                    File fil = new File("D:\\"+name);   //创建文件对象
                    item.write(fil);    //把上传的文件下载
                }
            }
        } catch (FileUploadException e) {
            e.printStackTrace();
        } catch (Exception e) {
            e.printStackTrace();
        }
        return params;
    }

Ajax中文乱码问题:https://blog.csdn.net/qq_22771739/article/details/81564042

相关推荐

mmywcoco / 0评论 2020-06-06