form表单上传批量上传图片发送后台

1. 表单

<form id="myform" method="post" enctype="multipart/form-data">
<div class="form-group" >
      <label for="plainGoodsName">商品名</label>
      <input type="text" class="form-control" id="plainGoodsName"name="plainGoodsName" placeholder="请输入商品名">
</div>

<div class="form-group">
        <label for="plainGoodsImg">商品图片</label>
        <a style="float: left;border:1px solid #eee;width: 100%;padding: 10px;box-sizing: border-box;margin:5px 0;" href="javascript:;" class="a-upload">
              <input type="file" multiple  name="files" id="plainGoodsImg" onchange="xmTanUploadImg_1(this,'xmTanImg_1')" accept="image/*"/>
               <img style="width: 80px;" id="xmTanImg_1"/>
              <div style="width: 80px;height: 80px;display: none;" id="xmTanDiv_1"></div>
          </a>
</div>
                    <div class="form-group">
                        <label for="plainGoodsPrice">商品价格</label>
                        <input type="text" class="form-control" id="plainGoodsPrice" name="plainGoodsPrice" placeholder="请输入商品价格">
                    </div>

                    <div class="form-group">
                        <label for="plainGoodsNum">商品库存</label>
                        <input type="text" class="form-control" id="plainGoodsNum" name="plainGoodsNum" placeholder="商品库存">
                    </div>
                    <div class="form-group">
                        <label for="plainGoodsContext">商品描述</label>
                       <!-- <input type="text" class="form-control" id="plainGoodsContext" name="plainGoodsContext" placeholder="商品描述"> -->
                        <textarea class="form-control" id="plainGoodsContext" name="plainGoodsContext" rows="3"></textarea>
                    </div>
                    <div class="form-group">
                                 <label></label>
                             <button type="button" onclick="saveGoods()" class="btn btn-primary">添加商品</button>
                    </div>
                </form>
第一、上传图片时form表单中加入 enctype=“multipart/form-data” 否则会出现问题 后台接收不到

2. ajax请求

 var formData = new FormData($( "#myform" )[0]);
  $.ajax({
            url:"${ctx}/back/exchangeShopping/addGoods.action",
            type:"POST",
            dataType:"json",
            data:formData,
            processData: false,// 不加会报错
            contentType: false,// 不加会报错
            success:function(data) {
                if(data == "true"){
                    layer.msg('添加成功',{icon:6,time:1500,end:function () {
                            window.location.reload();
                        }});
                }else {
                    layer.msg(data,{icon:5,time:1500});
                }
            }
        })
有几个要注意的地方：
第一、ajax要加上两个属性
processData: false,// 不加会报错
contentType: false,// 不加会报错
第二、 var formData = new FormData($( “#myform” )[0]);
使用formdata序列化表单
关于jquery的 $(“form”).serialize()和 new FormData表单序列化
网址：https://blog.csdn.net/cracklibby/article/details/80013112
$(“form”).serialize()只会序列化表单不会序列化文件

问题：带文件上传的form表单序列化 传参问题
使用formdata 序列化form表单 后台使用@RequestParam(value = “files”, required = false)MultipartFile files,wFrontPlainGoods goods 接收
并且MultipartFile 名字要与页面name的名字相同

3.后台接口

@ResponseBody
@RequestMapping("/addGoods.action")
public String addGoods(@RequestParam(value = "files", required = false)MultipartFile files,wFrontPlainGoods goods){
          String Info = this.backExchangeShoppingService.addGoods(goods,files);
          return JSONObject.toJSONString(Info);
 }

4.将图片下载指定的地方 返回url

    //下载文件到本地的通用方法 返回值nextSrc
    public static String  down2(String url2, String title) throws Exception {
        //获取URL对象
        URL url = new URL(url2);
        //根据URL打开链接
        URLConnection connection = url.openConnection();
        //从连接处获取输入流对象
        InputStream inputStream = connection.getInputStream();
        File file = new File("/Users/lvxiaokai/Desktop/tina/img/images/character/");
        if(!file.exists()){
            file.mkdirs();
        }
        String uuid = UUID.randomUUID().toString().replaceAll("-","");
        String   nextSrc = "/Users/lvxiaokai/Desktop/tina/img/images/character/"+title+".jpg";
        IOUtils.download(nextSrc , inputStream);
        return nextSrc;
    }