首页 > Web开发 > 详细

通过ajax上传文件

时间:2020-06-03 09:36:46      阅读:46      评论:0      收藏:0      [点我收藏+]

html前端代码(表单内的标签必须有name属性才可以被后台获取)
技术分享图片
必须要在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

通过ajax上传文件

原文:https://www.cnblogs.com/c21w/p/13034898.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!