基於Spring Boot實現圖片上傳/加水印一把梭操作

CodeSheep發表於2018-11-15

小網紅

文章共 537字,閱讀大約需要 2分鐘 !


概述

很多網站的圖片為了版權考慮都加有水印,尤其是那些圖片類網站。自己正好最近和圖片打交道比較多,因此就探索了一番基於 Spring Boot這把利器來實現從 圖片上傳 → 圖片加水印 的一把梭操作!

注: 本文首發於 My Personal Blog:程式羊,歡迎光臨 小站

本文內容腦圖如下:

本文內容腦圖


搭建 Spring Boot基礎工程

過程不再贅述了,這裡給出 pom中的關鍵依賴:

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>

        <dependency>
            <groupId>commons-io</groupId>
            <artifactId>commons-io</artifactId>
            <version>2.5</version>
        </dependency>
    </dependencies>
複製程式碼

編寫檔案上傳服務

  • 主要就是編寫 ImageUploadService 服務

裡面僅一個上傳圖片的方法:uploadImage 方法

    /**
     * 功能:上傳圖片
     * @param file 檔案
     * @param uploadPath 伺服器上上傳檔案的路徑
     * @param physicalUploadPath  伺服器上上傳檔案的物理路徑
     * @return 上傳檔案的 URL相對地址
     */
    public String uploadImage( MultipartFile file, String uploadPath, String physicalUploadPath ) {

        String filePath = physicalUploadPath + file.getOriginalFilename();

        try {
            File targetFile=new File(filePath);
            FileUtils.writeByteArrayToFile(targetFile, file.getBytes());
        } catch (IOException e) {
            e.printStackTrace();
        }
        return uploadPath + "/" + file.getOriginalFilename();
    }
}
複製程式碼

編寫圖片加水印服務

  • 編寫 ImageWatermarkService 服務

裡面就一個主要的 watermarkAdd方法,程式碼後面寫有詳細解釋

@Service
public class ImageWatermarkService {

    /**
     * imgFile 影像檔案
     * imageFileName 影像檔名
     * uploadPath 伺服器上上傳檔案的相對路徑
     * realUploadPath 伺服器上上傳檔案的物理路徑
     */
    public String watermarkAdd( File imgFile, String imageFileName, String uploadPath, String realUploadPath ) {

        String imgWithWatermarkFileName = "watermark_" + imageFileName;
        OutputStream os = null;

        try {
            Image image = ImageIO.read(imgFile);

            int width = image.getWidth(null);
            int height = image.getHeight(null);

            BufferedImage bufferedImage = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);  // ①
            Graphics2D g = bufferedImage.createGraphics();  // ②
            g.drawImage(image, 0, 0, width,height,null);  // ③

            String logoPath = realUploadPath + "/" + Const.LOGO_FILE_NAME;  // 水印圖片地址
            File logo = new File(logoPath);        // 讀取水印圖片
            Image imageLogo = ImageIO.read(logo);

            int markWidth = imageLogo.getWidth(null);    // 水印圖片的寬度和高度
            int markHeight = imageLogo.getHeight(null);

            g.setComposite( AlphaComposite.getInstance(AlphaComposite.SRC_ATOP, Const.ALPHA) );  // 設定水印透明度
            g.rotate(Math.toRadians(-10), bufferedImage.getWidth()/2, bufferedImage.getHeight()/2);  // 設定水印圖片的旋轉度

            int x = Const.X;
            int y = Const.Y;

            int xInterval = Const.X_INTERVAL;
            int yInterval = Const.Y_INTERVAL;

            double count = 1.5;
            while ( x < width*count ) {  // 迴圈新增多個水印logo
                y = -height / 2;
                while( y < height*count ) {
                    g.drawImage(imageLogo, x, y, null);  // ④
                    y += markHeight + yInterval;
                }
                x += markWidth + xInterval;
            }

            g.dispose();

            os = new FileOutputStream(realUploadPath + "/" + imgWithWatermarkFileName);
            JPEGImageEncoder en = JPEGCodec.createJPEGEncoder(os); // ⑤
            en.encode(bufferedImage); // ⑥

        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            if(os!=null){
                try {
                    os.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }

        return uploadPath + "/" + imgWithWatermarkFileName;
    }

}
複製程式碼

程式碼思路解釋如下:

可以對照程式碼中的標示數字和下面的解釋進行理解:

① 建立快取圖片 ② 建立繪圖工具 ③ 將原圖繪製到快取圖片 ④ 將水印logo繪製到快取圖片 ⑤ 建立影像編碼工具類 ⑥ 編碼快取影像生成目標圖片

可見思路清晰易懂!


編寫 圖片上傳/處理 控制器

我們在該控制器程式碼中將上述的 圖片上傳服務圖片加水印服務 給用起來:

@RestController
public class WatermarkController {

    @Autowired
    private ImageUploadService imageUploadService;

    @Autowired
    private ImageWatermarkService watermarkService;

    @RequestMapping(value = "/watermarktest", method = RequestMethod.POST)
    public ImageInfo watermarkTest( @RequestParam("file") MultipartFile image ) {

        ImageInfo imgInfo = new ImageInfo();

        String uploadPath = "static/images/";  // 伺服器上上傳檔案的相對路徑
        String physicalUploadPath = getClass().getClassLoader().getResource(uploadPath).getPath();  // 伺服器上上傳檔案的物理路徑

        String imageURL = imageUploadService.uploadImage( image, uploadPath, physicalUploadPath );
        File imageFile = new File(physicalUploadPath + image.getOriginalFilename() );

        String watermarkAddImageURL = watermarkService.watermarkAdd(imageFile, image.getOriginalFilename(), uploadPath, physicalUploadPath);

        imgInfo.setImageUrl(imageURL);
        imgInfo.setLogoImageUrl(watermarkAddImageURL);
        return imgInfo;
    }
}
複製程式碼

實際實驗與效果展示

我們用 Postman工具來輔助我們發出 localhost:9999/watermarktest 請求,進行圖片上傳的操作:

Postman發請求進行圖片上傳

之後我們再去專案的資源目錄下檢視上傳的原圖加完水印後圖片的效果如下:

原圖

加完水印後的圖片

喔唷,這水印 Logo是不是打的有點多...

不過這下終於不用害怕別人對您的圖片侵權啦 !


後記

由於能力有限,若有錯誤或者不當之處,還請大家批評指正,一起學習交流!



長按掃描 下面的 小心心 來訂閱作者公眾號 CodeSheep,獲取更多 務實、能看懂、可復現的 原創文 ↓↓↓

CodeSheep · 程式羊


相關文章