使用MultipartHttpServletRequest进行文件上传需要注意的点

最开始的时候用post请求的方式往后台传数据，发现后台接收不到转码后的图片信息。

if($form.valid()) {  //表单校验
            debugger;
            var mydata = $("#pic", _currentModal)[0].files[0];//这里是图片
            $form.append("mydata", mydata);
            ZYUI.block();
            $.ajax({
                type: "POST",
                cache: false,
                url: rootPath + "/GoodsMaintain/add",
                contentType: "application/json; charset=utf-8",//POST一定要加这一句，不要忘了
                dataType: "json",
                data: JSON.stringify($form.serializeJson()),
                success: function (data) {
                    if (data.result == 'success') {
                        $("#close_button").trigger("click");
                        bootbox.alert(data.Msg);
                        goodsMaintain.refresh();
                    } else {
                        bootbox.alert(data.errMsg);
                    }
                    ZYUI.unblock();
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    bootbox.alert("新增商品信息失败！");
                    ZYUI.unblock();
                }
            });
        }

检查代码，我后台控制层是用的是MultipartHttpServletRequest进行文件传输

  MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest) request
  MultipartFile multipartFile = multipartHttpServletRequest.getFile("mydata");

百度后发现MultipartHttpServletRequest是不能用在post请求的，但是我这里又有很多的数据要传到后台保存，鱼和熊掌必须要兼得，请教了下解决办法有，就是数据和图片用ajax分开保存。下面是操作
HTML部分：

<div class="col-md-6 form-group">
                <div class="col-md-12">
                <input type="hidden" name="imgUrl"  id="imgUrl"/>
                <input type="file" name="logoFile" id="logoFile" multiple="multiple" accept="i image/x-png, image/jpeg, image/gif " onchange="setImg(this);" >  //使用onchange事件做上传图片操作
                </div>
                <span><img id="imgShow" src="" width="150" height="150"/></span>
            </div>

JS部分：

function setImg(obj) {//用于进行图片上传，返回地址
    var f = $(obj).val();
    console.log(f);
    if (f == null || f == undefined || f == '') {
        return false;
    }
    if (!/\.(?:png|jpg|bmp|gif|PNG|JPG|BMP|GIF)$/.test(f)) {
        alert("类型必须是图片(.png|jpg|bmp|gif|PNG|JPG|BMP|GIF)");
        $(obj).val('');
        return false;
    }
    var data = new FormData();
    $.each($(obj)[0].files, function (i, file) {
        console.log(file);
        data.append('file', file);
    });
    $.ajax({
        type: "POST",
        url: "/GoodsMaintain/uploadPicture",
        data: data,
        cache: false,
        contentType: false,    //不可缺
        processData: false,    //不可缺
        dataType: "json",
        success: function (data) {
            if (data.errMsg == "SUCCESS") {
                $("#imgUrl").val(data.imgUrl);//将地址存储好
                $("#imgShow").attr("src", rootPath + "itemsImg\\" + data.imgShow);//显示图片
            } else {
                alert("上传失败");
                $("#url").val("");
                $(obj).val('');
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert("上传失败，请检查网络后重试");
            $("#url").val("");
            $(obj).val('');
        }
    });
}

同时在控制层重新写一个接收图片的方法

def uploadPicture(){
       MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest) request
        MultipartFile multipartFile = multipartHttpServletRequest.getFile("file");
        String imgName = multipartFile.getOriginalFilename();
        //  println("imgName---->" + imgName)
        String img = Base64Img.GetImageInputStream(multipartFile.inputStream);
        // println("img---->" + img)"/itemsImg/"
        String imgPath = request.getSession().getServletContext().getRealPath("/") + "itemsImg\\";
        //  println("imgPath---->" + imgPath)
        Boolean success = Base64Img.GenerateImage(img, imgPath, imgName);//图片是否添加成功
        JSONObject jsonResult = new JSONObject()
        String errMsg = "false"
        if (success) {
            jsonResult.put("imgUrl", imgPath + imgName);
            jsonResult.put("imgShow", imgName);
            errMsg = "SUCCESS"
        }
        jsonResult.put("errMsg", errMsg)
        render jsonResult;
    }

收工！