Home > Web Front-end > JS Tutorial > Use the images+imageinfo library to add watermarks to images in batches in the Node project

Use the images+imageinfo library to add watermarks to images in batches in the Node project

青灯夜游
Release: 2022-02-16 20:12:23
forward
2949 people have browsed it

How to add watermarks to images in batches in Nodejs? The following article will introduce to you how to use the images imageinfo library to add watermarks to pictures in batches in the Node project. I hope it will be helpful to you!

Use the images+imageinfo library to add watermarks to images in batches in the Node project

NodejsAdd watermarks to images in batches

Environment preparation

Install images library

npm install images
Copy after login

Install imageinfo library

npm install imageinfo
Copy after login

Implementation

In this example, addimageinfo.js is in the same directory as marklogo.png, imagest folder, and node_modules folder.

Sub-files can also be implemented

JS code

If you use it directly, you need to modify the information

var logomarkimg = images('./marklogo.png');//水印位置
var rmimgpath = "./imagest/img/";//添加图片文件加位置
var mark = "logo_";//另存图片前缀,若为""则替换原图片
Copy after login

Full code addimageinfo. js

//引用文件系统模块
var fs = require("fs");
//引用imageinfo模块
var imageInfo = require("imageinfo");
//引用images模块
var images = require('images');

var logomarkimg = images('./marklogo.png');//水印位置
var rmimgpath = "./imagest/img/";//添加图片文件加位置
var mark = "logo_";//另存图片前缀,若为""则替换原图片

function readFileList(path, filesList) {
    var files = fs.readdirSync(path);
    files.forEach(function (itm, index) {
        var stat = fs.statSync(path + itm);
        if (stat.isDirectory()) {
            //递归读取文件
            readFileList(path + itm + "/", filesList)
        } else {
            var obj = {};//定义一个对象存放文件的路径和名字
            obj.path = path;//路径
            obj.filename = itm//名字
            filesList.push(obj);
        }
    })
}
var getFiles = {

    //获取文件夹下的所有文件
    getFileList: function (path) {
        var filesList = [];
        readFileList(path, filesList);
        return filesList;
    },
    //获取文件夹下的所有图片
    getImageFiles: function (path) {
        var imageList = [];
        this.getFileList(path).forEach((item) => {
            var ms = imageInfo(fs.readFileSync(item.path + item.filename));
            ms.mimeType && (imageList.push(item))
        });
        return imageList;
    }
};
//获取文件夹下的所有图片
var photos = getFiles.getImageFiles(rmimgpath);
for (var i = 0; i < photos.length; i++) {
    var sourceImgpath = photos[i].path;
    var sourceImgname = photos[i].filename;
    var sourceImg = images(sourceImgpath + sourceImgname);
    var sWidth = sourceImg.width();
    var sHeight = sourceImg.height();
    var wmWidth = logomarkimg.width();
    var wmHeight = logomarkimg.height();

    images(sourceImg)
        // 设置绘制的坐标位置,右下角距离 10px
        .draw(logomarkimg, sWidth - wmWidth - 10, sHeight - wmHeight - 10)
        // 保存格式会自动识别
        .save(sourceImgpath + mark + sourceImgname + '');
}
Copy after login

Run

In the directory, run the node command

node ./addimageinfo.js
Copy after login

View the effect

Use the images+imageinfo library to add watermarks to images in batches in the Node project
Use the images+imageinfo library to add watermarks to images in batches in the Node project
Use the images+imageinfo library to add watermarks to images in batches in the Node project

##For more node-related knowledge, please visit:

nodejs tutorial!

The above is the detailed content of Use the images+imageinfo library to add watermarks to images in batches in the Node project. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:csdn.net
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template