使用Aajx将Canvas传入后台

2017-01-06 19:39:37来源:CSDN作者:u013844327人点击

    1:前端代码。    // 获取Canvas的编码。    var imgData = document.getElementById("canvas").toDataURL("image/jpeg");    // 上传到后台。    $.ajax({         type: "post",                url:"$!front_url/uploadImg",         data: {image : imgData},         async: true,         success: function (htmlVal) {               alert("另存图片成功!");         },	error: function(data) {               alert(e.responseText); //alert错误信息         }    });

     

     // 2.Java代码, 此代码在后期改为了上传5张图片,循环保存的,大家需要根据自己需求改改就行。

     @RequestMapping(value = "portal/upLoadImage")

     @ResponseBody

    public Object uploadImg(String id, String image1, String image2, String image3, String image4, String image5, HttpServletRequest request, HttpServletResponse response) {


        response.setHeader("Access-Control-Allow-Origin", "*");
        Map<String, Object> map = new HashMap<String, Object>();
        Base64 base64 = new Base64();
        try {
            
            // 获取上传文件的BASE编码。
            String[] imgs = {image1, image2, image3, image4, image5};


            File file = new File(basePath + "/" + id);
            // 判断文件是否存在。
            if(!file.exists()) {
                // 新建文件夹。
                file.mkdirs();
            }


            // 循环保存图片。
            int count = 0;
            List<String> urlList = new ArrayList<String>();
            for (int i = 0; i < imgs.length; i++) {
                if(null != imgs[i]) {
                    byte[] k = base64.decode(imgs[i].substring("data:image/jpeg;base64,".length()));
                    InputStream is = new ByteArrayInputStream(k);
                    String fileName = UUID.randomUUID().toString().replace("-", "");
                    String imgFilePath = basePath + "/" + id + "/" + fileName + ".jpg";
                    BufferedImage imageB = ImageIO.read(is);
                    boolean flag = ImageIO.write(imageB, "jpg", new File(imgFilePath));
                    System.out.println(imgFilePath + " ------- " + flag);
                    if(flag) {
                        count++;
                        urlList.add("http://10.0.10.16:8080/uploads/" + id + "/" + fileName + ".jpg");
                    }
                }
            }


            map.put("code", 0);
            map.put("count", count);
            map.put("url", urlList);
        } catch (Exception e) {
            logger.error("图片上传:", e);
        }
        return map;
    }

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台