이미지 업로드 – 2. gm 모듈로 이미지 리사이징

Multer 모듈로 이미지 업로드에 성공했다면 서버에 업로드된 이미지 파일 경로을 알수 있다. 이번 글에는  gm 모듈을 사용하여 이미지 리사이징 하는 방법에 대해 알아본다.

설치

노드에서 많이 사용하는 이미지 프로세싱 라이브러리 중 하나인 gm을 설치하자.

$ npm install --save gm

gm 라이브러리를 사용하기 위해서는 GraphicsMagick 이나  ImageMagick 등의 라이브러리를 추가 설치해야한다.  GraphicsMagick을 설치한다.

$ sudo apt-get install graphicsmagick

섬네일 이미지

라이브러리 사용법은 매우 간단하다.  require('gm')('파일 경로') 를 함수 체인으로 이용하여 이미지 처리를 할수 있다. 썸네일 이미지를 만들고자 하면 thumb() 함수를 이용한다.

gm('image.jpg')
    .thumb(100, 100, 'imgs/thumb.jpg', function (err) {
      if (err) console.error(err);
      else console.log('done - thumb');
    });

메타 데이터 제거

이미지 메타정보(EXIF profile data) 제거시에는 noProfile() 함수를 사용한다.

gm('image.jpg')
    .noProfile()
    .write('noprofile.jpg', function (err) {
      if (err) console.error(err);
      else console.log('done - noprofile');
    });

 

블러 이미지

blur() 함수로 블러 이미지를 생성할 수 있다.

gm('image.jpg')
    .blur(19, 10)
    .write('blur.jpg', function (err) {
      if (err) console.error(err);
      else console.info('done - blur')
    });

리사이징

resize(width, height) 함수로 리사이징 한다. 파라매터로 넘겨주는 width와 height중 이미지 비율을 유지할 수 있는 값으로 width나 height 값을 취하여 리사이징한다. 이것은 thumb()이 이미지를 잘라 내는 것과 다른 점이다.

gm('image.jpg')
  .resize(100, 200)
  .write('100_200.jpg', function (err) {
    if (err) console.error(err)
    else console.log('done')
  });

소스코드: https://github.com/jeonghwan-kim/gm-test