Java 上传多张图片

最新推荐文章于 2024-06-04 09:58:08 发布

骑驴找大爷

最新推荐文章于 2024-06-04 09:58:08 发布

阅读量1.4k

点赞数

分类专栏： jsp传输数据文章标签： html ajax java spring

本文链接：https://blog.csdn.net/cx19910829/article/details/77449104

版权

jsp传输数据专栏收录该内容

3 篇文章 0 订阅

订阅专栏

 今天做了个管理后台简单的小功能，是上传两张图片到服务器，然而却遇到了很多的坑，今天把问题解决了，顺便来记录下，以后大家遇到此类问题可以按照此种方式。
 前端 ajax+html+BUI（这里考虑到大家用的框架不一样，所以就暂时不贴BUi的相关代码了）
      后台spring +mysql
      前端界面展示

<html>
 <head></head>
 <body>
  <div class="control-group span8"> 
   <label class="control-label">广告封面地址：</label> 
   <div class="controls"> 
    <input type="text" class="control-text" name="bannerImg" id="bannerImg" /> 
   </div> 
  </div> 
  <div class="control-group span8"> 
   <label class="control-label">广告跳转地址：</label> 
   <div class="controls"> 
    <input type="text" class="control-text " name="bannerUrl" id="bannerUrl" /> 
   </div> 
  </div> 
  <div class="control-group span8"> 
   <label class="control-label label-warning" id="inputTxex"><font color="red">广告封面图片上传：</font></label> 
   <div class="controls " id="inputType"> 
    <input type="file" class="control-text bannerImgs " id="handInputIdHold1" /> 
   </div> 
  </div>
 </body>
</html>

前端ajax处理（可适当修改下返回data，根据自己的返回数据定义判断）

function upload() {
    //var formData = new FormData($("#uploadFile"));
    var formData = new FormData();
    formData.append("handInputIdHold1", document.getElementById("handInputIdHold1").files[0]);
    formData.append("handInputIdHold2", document.getElementById("handInputIdHold2").files[0]);

    jQuery.ajax({
        type: 'POST',
        url: "uploadFile",
        data: formData,
        contentType: false,
        processData: false,
        complete: function(data) {
            var json = eval("(" + data.responseText + ")")       if (json.rescode == "success") { // 上传成功
                BUI.Message.Alert('上传成功！');
                var imgs = json.fileName;
                if (imgs.trim() != '') {
                    var arr = imgs.split(';');
                    //根据class 名称来赋值input标签的值
                    //我这边是先上传，然后回显示值，赋值到标签上，然后再去提交所有的form
                    $(".bannerImgs").val(arr[0]);
                    $(".bannerUrls").val(arr[1]);
                }
                // search.load();
            } else { // 上传失败
                BUI.Message.Alert('保存失败！');
            }
        }
    });
}

后端Java接收
BannerController.java

    @RequestMapping("/uploadFile")
    public String uploadFile(HttpServletRequest request) throws JsonProcessingException {
        Map<String, Object> file = null;
        try {
            file = bannerService.upladImage(request);
        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        return JsonUtil.obj2Json(file, true);
    }

BannerService.java

public Map<String, Object> upladImage(HttpServletRequest request) throws Exception {
        String fileName = "";
        System.out.println(request.getParameter("handInputIdHold1"));
        MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
        Map<String, Object> mapRestult = new HashMap<String, Object>();
        try {
            String path = fileImgPathForWin(multipartRequest);
            System.out.println(path);
            // 广告封面
            MultipartFile cover = multipartRequest.getFile("handInputIdHold1");
            // 广告跳转
            MultipartFile jump = multipartRequest.getFile("handInputIdHold2");
            if (cover != null) {
                cover.transferTo(new File(path + cover.getOriginalFilename()));
                fileName += cover.getOriginalFilename() + ";";
            }
            if (jump != null) {
                jump.transferTo(new File(path + jump.getOriginalFilename()));
                fileName += jump.getOriginalFilename();
            }
            mapRestult.put("rescode", "success");
            mapRestult.put("fileName", fileName);
        } catch (IllegalStateException e) {
            // TODO Auto-generated catch block
            mapRestult.put("rescode", "faled");
            mapRestult.put("fileName", "");
        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }

        return mapRestult;
    }

fileImgPathForWin 方法


    /**
     * 生成文件目录 windows 
     * 
     * @throws Exception
     */
    protected String fileImgPathForWin(HttpServletRequest request) throws Exception {

        // String files =littype + DateUtil.DateToString(new Date(),
        // DateStyle.yyyyMMddHHmmssSSS) + excelversion;
        String files = request.getSession().getServletContext().getRealPath("/") + "\\" + "excel" + "\\"
                + DateUtil.DateToString(new Date(), DateStyleEnum.YYYY_MM_DD) + "\\";
        File folder = new File(files);
        if (!folder.exists()) {
            folder.mkdirs();
        }
        return files;
    }

好了，基本上流程就是这样，大家有什么疑问可以回复我，一起学习进步。

骑驴找大爷

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Java 上传多张图片

今天做了个管理后台简单的小功能，是上传两张图片到服务器，然而却遇到了很多的坑，今天把问题解决了，顺便来记录下，以后大家遇到此类问题可以按照此种方式。前端 ajax+html 后台spring +mysql 前端界面展示<html> <head></head> <body> <div class="control-group span8"> <label class="
复制链接

扫一扫