如何为图像节点添加水印

Question

如何在nodejs中为图像添加水印。我正在使用环回框架，我想为上传的每张图像添加水印，我尝试了几个图像处理模块，但无法实现水印。

我尝试了带有代码的图像水印库：

watermark.embedWatermark('./server/storage/images/img_hkd.jpg', { 'text': 'sample watermark' });

但是我收到此错误：错误：生成标识ENOENT

Answer 1

而不是watermark使用jimp模块。它对我有用。

let imgActive = 'active/image.jpg';
Jimp.read('raw/originalimage.png')
      .then((tpl) => tpl.clone().write(imgActive))
      .then(() => Jimp.read(imgActive))
      .then((tpl) =>
          Jimp.read('raw/logo.png').then((logoTpl) => {
              logoTpl.opacity(0.2)
              return tpl.composite(logoTpl, 512, 512, [Jimp.BLEND_DESTINATION_OVER])
          }),
      )
      .then((tpl) => tpl.write('raw/watermark.png'))
    }

Answer 2

只需使用一个包，我已经使用了虚构而没有任何问题。

//Install
npm install imaginary --save
//Import 
var fs = require('fs')
var imaginary = require('imaginary')
var serverUrl = 'localhost:8080'
imaginary('myImage.jpg')
  .server(serverUrl)
  .watermark({ text: 'copyright' })
  .on('error', function (err) {
    console.error('Cannot resize the image:', err)
  })
  .pipe(fs.createWriteStream('markedImage.jpg'))

https://github.com/h2non/node-imaginary

Answer 3

包锐可以做到这一点，它适用于两个图像或一个图像和带有字体和其他样式的文本，旋转和模糊，供参考

为带有徽标的图像加水印：常量尖锐 = 要求("尖锐"(;

async function compositeImages() {
  try {
    await sharp("underwater.png")
      .composite([
        {
          input: "sammy-transparent.png",
          top: 50,
          left: 50,
        },
      ])
      .toFile("sammy-underwater.png");
  } catch (error) {
    console.log(error);
  }
}

复合图像((

在图像上添加文本：

const sharp = require("sharp");
async function addTextOnImage() {
  try {
    const width = 750;
    const height = 483;
    const text = "Sammy the Shark";
    const svgImage = `
    <svg width="${width}" height="${height}">
      <style>
      .title { fill: #001; font-size: 70px; font-weight: bold;}
      </style>
      <text x="50%" y="50%" text-anchor="middle" class="title">${text}</text>
    </svg>
    `;
    const svgBuffer = Buffer.from(svgImage);
    const image = await sharp("sammy.png")
      .composite([
        {
          input: svgBuffer,
          top: 0,
          left: 0,
        },
      ])
      .toFile("sammy-text-overlay.png");
  } catch (error) {
    console.log(error);
  }
}
addTextOnImage();

参考： https://www.digitalocean.com/community/tutorials/how-to-process-images-in-node-js-with-sharp