基于Ajax的formData图片和数据上传(前端发送及后端验证)

淩亂°似流年 2022-06-15 00:11 190阅读 0赞

前端部分在这里(亲测可用)

http://blog.csdn.net/woyidingshijingcheng/article/details/72461561

相关知识点的网址

https://developer.mozilla.org/zh-CN/docs/Web/API/FormData/Using_FormData_Objects
    
    https://developer.mozilla.org/zh-CN/docs/Web/API/FormData
    
    http://m.blog.csdn.net/article/details?id=52330280

后端部分  
首先是主要的jar，基于maven的

<dependency>
          <groupId>commons-fileupload</groupId>
          <artifactId>commons-fileupload</artifactId>
          <version>1.3.1</version>
     </dependency>

在Spring配置中添加配置文件

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
            <property name="maxUploadSize" value="10485760" />
            <property name="defaultEncoding" value="UTF-8" />
    </bean>

最后Controller(接收端的代码)

@ResponseBody
        @RequestMapping(value = "/addGoods", method = RequestMethod.POST, produces = "application/json;charset=UTF-8")
        public Response addGoods( @RequestParam("barterCommodityname") String barterCommodityname,@RequestParam("barterSellingprice") BigDecimal barterSellingprice,@RequestParam("barterContactinformation") String barterContactinformation,     @RequestParam("barterCommodityquantity") Short barterCommodityquantity,                      @RequestParam("barterCommodityaddress") String barterCommodityaddress,                          @RequestParam("barterDescriptioninform") String barterDescriptioninform,
    @RequestParam("barterCategoryid") String barterCategoryid,
    @RequestParam("file") MultipartFile[] multipartFiles) {
    
            BarterGoodsVo barterGoodsVo = new BarterGoodsVo(barterCommodityname, barterSellingprice, barterContactinformation,
                    barterCommodityquantity, barterCommodityaddress, barterDescriptioninform, barterCategoryid);
    
            String fileName = "";
            String realpath = getRealPath();
            //保存图片
            try {
                for (MultipartFile multipartFile : multipartFiles) {
             String ext = StringUtils.substring(multipartFile.getOriginalFilename(), multipartFile.getOriginalFilename().lastIndexOf("."));
                        fileName = UUID.randomUUID().toString() + ext;
                        saveFile(realpath, fileName, multipartFile);
                }
            } catch (Exception e) {
                logger.error(e + "图片保存错误或者MD5保存错误");
                return Response.failure(BarterGoodsStatusEnum.GOODS_SAVE_ERROR.value(), BarterGoodsStatusEnum.GOODS_SAVE_ERROR.reasonPhrase());
            }
    
            barterGoodsService.addBarterGoods(barterGoodsVo, realpath);//保存商品
            return Response.success(HttpStatus.OK.value(), HttpStatus.OK.getReasonPhrase());
        }

这样就可以完成图片上传了