使用Node.JS + express 实现一个图片水印

107 阅读1分钟

第一种:用户上传原始图片,服务器保留原始图片以及水印图片

第二种:动态水印

用户上传图片 --》服务端:只保留原始图片,当请求图片时,服务器加水印。缺点:增加服务端压力

Jimp三方库:

1.安装

2.

```// 导入三方库
const path = require('path');
const jimp = require('jimp');
// 给一张图片加水印
// proportion水印和图片比例  marginProportion右边的距离
async function mark(waterFile, originFile, targetFile, proportion = 10, marginProportion = 0) {
    const [water, origin] = await Promise.all([
        jimp.read(waterFile),
        jimp.read(originFile),
    ]);
    // 对水印照片缩放 获取当前的比例
    const curProportion = origin.bitmap.width / water.bitmap.width;
    water.scale(curProportion / proportion)\
    // 计算位置
    const right = origin.bitmap.width * marginProportion;
    const bottom = origin.bitmap.height * marginProportion;
    const x = origin.bitmap.width - right - water.bitmap.width;
    const y = origin.bitmap.height - bottom - water.bitmap;
    // 写入水印
    origin.composite(water, x, y, {
        mode: jimp.BLEND_SOURCE_OVER,
        opacitySource: 0.3,
    });
    await origin.write(targetFile);
}
async function test(){
    const waterPath = '';
    const originPath = '';
    const targetPath = '';
    mark();
}