Imagemagick 모듈

imagemagick 를 사용하게 된 이유 : 이미지 프로세싱 하는 타 모듈은 memoryMaxSize 가 설정되어 있어서 큰 사이즈의 이미지는 처리가 안됨. (limit 을 늘리지 않은 이상)

limit 없이 사용할 수 있는 모듈을 찾다가 imagemagick 모듈을 사용하게 됨

아래는 Example 파일 경로를 읽고 결과물을 파일로 저장하는 코드

URL 로 데이터를 읽고, CDN 에 업로드를 해야 하는 과정이 추가된다면? 파일을 굳이 저장할 필요 없이 Buffer 를 활용하면 됨.

const im = require('imagemagick')

const opt = {};
opt.srcPath = './src/to/path';
opt.dstPath = './dst/to/path';
opt.width = 250;

im.resize(opt, (err, stdout, stderr) => {
  //stdout
});

Node.js 의 Buffer

Buffer : 데이터를 한 곳에 일시적으로 보관할 수 있는 메모리의 영역을 말함

Node.js 에서는 Buffer 를 바이너리 데이터를 저장할 수 있는 특수한 유형의 객체로서 제공한다.

  • 바이너리데이터는 0과 1로 이루어져있음
  • Buffer 객체는 16진수 바이트로 표현 (ex. <Buffer 44 12 3e ff ... )

Node.js 에서 Buffer 를 어떻게 활용하는지 알기 위해서 fs 모듈을 이용한 테스트를 진행해봄

const fs = require('fs');

var srcData = fs.readFileSync('sample.jpg');
console.log(srcData);  // <Buffer aa bb ...>

fs.writeFileSync('copySample.jpg');
var dstData = fs.readFileSync('copySample.jpg');
console.log(dstData);  // <Buffer aa bb ...>

결과 : fs 로 jpg 파일을 읽으면 바이너리 데이터를 Buffer 형식으로 제공


imagemagick 와 Node.js 의 Buffer 를 활용해보기

imagemagick 의 srcData 옵션으로 이미지의 데이터를 Buffer 형태로 제공

im.resize 결과로 stdout 데이터는 바이너리로 제공됨 (binary 데이터를 처리하기 위해서는 buffer 객체에 담아야 함)

테스트로 알게 된 것은 Buffer.from(data, 'encoding') 을 활용하여 버퍼에 담을 데이터 형식을 지정할 수 있다라는 것이다.

const im = require('imagemagick');
const fs = require('fs');

var srcData = fs.readFileSync('sample.jpg');

const opt = {}; 
opt.srcData = srcData; 
opt.width = 250; 
im.resize(opt, (err, stdout, stderr) => { 
  // stdout 데이터는 binary 형식으로 전달됨 -> 파일을 저장하기 위해 Buffer 형태로 제공해야 함
  fs.writeFileSync('resizedSample.jpg', Buffer.from(stdout, 'binary'));
});

그럼 base64 인코딩 된 데이터도 버퍼에 담아서 처리도 할 수 있다.

var imageBase64EncodedData = 'R01GOD1AAE.....BADs=';

const opt = {}; 
opt.srcData = Buffer.from(imageBase64EncodedData, 'base64');
opt.width = 250;

im.resize(opt, (err, stdout, stderr) => {  
  fs.writeFileSync('resizedSample.jpg', Buffer.from(stdout, 'binary')); 
});

+ Recent posts