BlackCoffy

nodejsで画像のリサイズや変換

sharpを使って画像のリサイズ、変換した時の備忘録です。

ドキュメント

sharpで画像の変換

sharpのインストール

npm install sharp

sharpの読み込み

import sharp from 'sharp'

アスペクト比固定で指定サイズに収まるようにリサイズ

const resizeImage = async (inputFile, outputFile, maxWidth, maxHeight) => await sharp(inputFile)
  .resize(maxWidth, maxHeight, {
    fit: 'inside'
  })
  .toFile(outputFile);

jpgに変換

上記、リサイズした後にjpegに変換する

qualityは、defaultが80。60ぐらいでも問題ない感じがする

jpeg

const resizeImageToJpg = async (inputFile, outputFile, maxWidth, maxHeight) => await sharp(inputFile)
  .resize(maxWidth, maxHeight, {
    fit: 'inside'
  })
  .jpeg({
    quality: 60
  })
  .toFile(outputFile);

webpに変換

jpegでなく、webpに変換する場合

同じくqualityは、defaultが80。

webp

const resizeImageToJpg = async (inputFile, outputFile, maxWidth, maxHeight) => await sharp(inputFile)
  .resize(maxWidth, maxHeight, {
    fit: 'inside'
  })
  .webp({
    quality: 70
  })
  .toFile(outputFile);

特定のリサイズにして、背景を白にする

サムネイルなんかで特定のサイズにしたい場合に使える。

fit, backgroundを追加で指定する

const resizeImageFitSize = async (inputFile, outputFile, maxWidth, maxHeight) => await sharp(inputFile)
.resize({
  width: maxWidth,
  height: maxHeight, 
  fit: 'contain',
  background: '#fff'
})
.jpeg({
  quality: 60
})
.toFile(outputFile);

metadataを取得

const getMetadata = async (filePath) => await sharp(filePath).metadata();