Html实现图片上传/裁剪/马赛克/压缩/旋转/缩放

cropper下载   https://download.csdn.net/download/dongyan3595/90970115

前端代码

    
    
    
    
    
    
    


    

        

            
            
        

        

            

        
        

            
            
            
            
            
            
        
        

            

                 向左旋转
                
            
            

                 向右旋转
                
            
        
        

            

                

                    
                
                 上传图片
                
            
            

                 裁剪上传
            
        
        

            

                马赛克大小:
                
                10px
            
        
        

            

                图片压缩:
                
                100%
            
        
    

后台代码

    @PostMapping({"upload-image"})
    public SuccessResultData uploadFile(@RequestParam("file") MultipartFile file, Double picturesThumbnails) throws IOException {
        // 参数校验
        if (file.isEmpty()) {
            throw new SaveException("上传文件不能为空");
        }
        InputStream inputStream = file.getInputStream();
        BufferedImage bufferedImage = ImageIO.read(inputStream);
        if (bufferedImage == null) {
            throw new SaveException("无效的图片文件");
        }
        BufferedImage image = bufferedImage;
        if (picturesThumbnails != null) {
            try {
                image = Thumbnails.of(new BufferedImage[]{bufferedImage}).scale(1).outputQuality(picturesThumbnails / 100).outputFormat("jpg").asBufferedImage();
            } catch (IOException e) {
                throw new SaveException("图片压缩出现异常");
            }
        }
        MultipartFile file1 = new MockMultipartFile(
                "file",            // 参数名（表单中的name）
                UUIDUtil.get32UUID() + ".jpg",        // 原始文件名
                "image/jpeg",
                convertToInputStream(image, "jpg")        // 文件输入流
        );
        Map params1 = new HashMap<>();
        String fileId1 = iFileService.uploadSingleByUserId(securityComponent.getCurrentUser().getUserId(), file1, UploadTypeEnum.IMAGE, params1);
        return new SuccessResultData(fileId1);
    }