JAVA spring+jcrop.js实现简单的头像剪裁

大家好，欢迎来到IT知识分享网。

项目需求有个功能要实现头像，让我这个后端开发来做这个确实有点为难，结合网上大神的例子，做了个简单的功能，以备不时之需

实现效果

页面+js

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; response.setHeader("Pragma","No-cache"); response.setHeader("Cache-Control","no-cache"); %>   
    
     
      
       
        
         <%-- 
        
          --%> 
          
           
            
            
            
            
            
            
            
           
 
             
            
 
             
 
              
 
               
 
                
 头像：  
 
                
 
                  static/img/1.jpg" class="jcrop-preview" alt="附件"> 
                         
 
               
 
               
 
                
 头像预览： 
 
                
 
                 
 
                  static/img/1.jpg" class="jcrop-preview" alt="预览">  
                 
 
 
               
 
               
 
                
 用户名： 
 
                
 艺名： 
 
               
 
              
 
             
 
             
 
              上传 
             
 
            
 
           
 
           
          
         
        
       
      
     
   

后端控制器

package com.lovo.controller; import java.io.File; import java.text.SimpleDateFormat; import java.util.Date; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.log4j.Logger; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.multipart.MultipartFile; import com.lovo.utils.CutImgeUtil; import com.lovo.utils.FileUploadCheck; @Controller public class FaceController { private static Logger logger = Logger.getLogger(FaceController.class); @RequestMapping(value = "/faceUpload.do",method = RequestMethod.POST) public void faceLoginController(HttpServletRequest request,HttpServletResponse response,Model model, @RequestParam("imgFile") MultipartFile imgFile,String userName,String artName){ //剪裁图片坐标 String x = request.getParameter("x"); String y = request.getParameter("y"); String w = request.getParameter("w"); String h = request.getParameter("h"); //原始图片坐标 String boundx = request.getParameter("boundx"); String boundy = request.getParameter("boundy"); //切图参数 int imgeX = (int) Double.parseDouble(x); int imgeY = (int) Double.parseDouble(y); int imegW = (int) Double.parseDouble(w); int imgeH = (int) Double.parseDouble(h); int srcX = (int) Double.parseDouble(boundx); int srcY = (int) Double.parseDouble(boundy); //文件保存文件夹 String path = request.getSession().getServletContext().getRealPath("/")+"fileUpload"+File.separator; //文件重命名 Date day = new Date(); SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMdd"); String newName = sdf.format(day)+System.currentTimeMillis()+".jpg"; try { //处理头像附件 if(imgFile !=null) { //判断是否为图片文件 if(FileUploadCheck.allowUpload(imgFile.getContentType())) { boolean cut = CutImgeUtil.cutImge(imgFile.getInputStream(), imgeX, imgeY, imegW, imgeH, srcX, srcY, path+newName); if(cut) { //当头像剪切成功进行用户信息数据库存储 System.out.println(userName+" "+artName+" "+newName); } } } } catch (Exception e) { e.printStackTrace(); logger.error("上传失败"); } } } 

工具类

package com.lovo.utils; import java.awt.Graphics; import java.awt.Image; import java.awt.Toolkit; import java.awt.image.BufferedImage; import java.awt.image.CropImageFilter; import java.awt.image.FilteredImageSource; import java.awt.image.ImageFilter; import java.io.ByteArrayOutputStream; import java.io.File; import java.io.InputStream; import javax.imageio.ImageIO; import org.apache.log4j.Logger; public class CutImgeUtil { private static Logger logger = Logger.getLogger(CutImgeUtil.class); / * 图片剪切工具类 * @param input 图片输入流 * @param x 截取时的x坐标 * @param y 截取时的y坐标 * @param desWidth 截取的宽度 * @param desHeight 截取的高度 * @param srcWidth 页面图片的宽度 * @param srcHeight 页面图片的高度 * @param newFilePath 保存路径+文件名 * @return */ public static boolean cutImge(InputStream input, int x, int y, int desWidth, int desHeight, int srcWidth,int srcHeight,String newFilePath){ boolean cutFlag = true; try { //图片类 Image imge ; ImageFilter cropFilter; //读取图片 BufferedImage bi = ImageIO.read(input); //当剪裁大小小于原始图片大小才执行 if(srcWidth >= desWidth && srcHeight >= desHeight) { //获取原始图 Image image = bi.getScaledInstance(srcWidth, srcHeight, Image.SCALE_DEFAULT); //获取新图 cropFilter = new CropImageFilter(x, y, desWidth, desHeight); imge = Toolkit.getDefaultToolkit().createImage(new FilteredImageSource(image.getSource(), cropFilter)); BufferedImage tag = new BufferedImage(desWidth, desHeight, BufferedImage.TYPE_INT_RGB); Graphics g = tag.getGraphics(); g.drawImage(imge, 0, 0, null); g.dispose(); File out = new File(newFilePath); // 输出文件 ImageIO.write(tag, "JPEG", out); } } catch (Exception e) { cutFlag = false; e.printStackTrace(); logger.error("剪切失败"); } return cutFlag; } } 

package com.lovo.utils; import java.util.Arrays; import java.util.List; public class FileUploadCheck { //支持的文件类型 public static final List 
  
    ALLOW_TYPES = Arrays.asList("image/jpg","image/jpeg","image/png","image/gif"); //校验文件类型是否是被允许的 public static boolean allowUpload(String postfix){ return ALLOW_TYPES.contains(postfix); } }