Node.js批量给图片加水印的方法


Posted in Javascript onNovember 15, 2016

一、准备工作:

首先,你要阅读完这篇文章:https://3water.com/article/97391.htm。

然后,我们安装node.js的一个模块:imageinfo。

npm install imageinfo

二、直接上DEMO:

步骤如下:

step1:文件夹结构

Node.js批量给图片加水印的方法

step2:JS代码

//引用文件系统模块
var fs = require("fs");
//引用imageinfo模块
var imageInfo = require("imageinfo");
//引用images模块
var images = require('images');
var watermarkImg = images('water_logo.png');
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.filename))
});
return imageList;
}
};
//获取文件夹下的所有图片
var photos = getFiles.getImageFiles("./public/");
for (var i = 0; i < photos.length; i++) {
var sourceImg = images('./public/'+photos[i]);
var sourceImgName = photos[i];
var sWidth = sourceImg.width();
var sHeight = sourceImg.height();
var wmWidth = watermarkImg.width();
var wmHeight = watermarkImg.height();
images(sourceImg)
// 设置绘制的坐标位置,右下角距离 40px
.draw(watermarkImg, sWidth - wmWidth - 40, sHeight - wmHeight - 40)
// 保存格式会自动识别
.save('./saveImg/'+ sourceImgName+'');
}

step3:运行node命令后,文件夹结构如下图

Node.js批量给图片加水印的方法

step4:查看批量加水印的图片

Node.js批量给图片加水印的方法

以上所述是小编给大家介绍的Node.js批量给图片加水印的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
在你的网页中嵌入外部网页的方法
Apr 02 Javascript
用document.documentElement取代document.body的原因分析
Nov 12 Javascript
JavaScript实现Flash炫光波动特效
May 14 Javascript
理解javascript中的原型和原型链
Jul 30 Javascript
php利用curl获取远程图片实现方法
Oct 26 Javascript
移动端横屏的JS代码(beta)
May 16 Javascript
想学习javascript JS和jQuery哪个重要 先学哪个
Dec 11 Javascript
js仿京东轮播效果 选项卡套选项卡使用
Jan 12 Javascript
jQuery点击头像上传并预览图片
Feb 23 Javascript
微信小程序使用request网络请求操作实例
Dec 15 Javascript
在vue.js中使用JSZip实现在前端解压文件的方法
Sep 05 Javascript
JavaScript cookie原理及使用实例
May 08 Javascript
AngularJS 中使用Swiper制作滚动图不能滑动的解决方法
Nov 15 #Javascript
AngularJS extend用法详解及实例代码
Nov 15 #Javascript
Windows系统下安装Node.js的步骤图文详解
Nov 15 #Javascript
jQuery checkbox选中问题之prop与attr注意点分析
Nov 15 #Javascript
javascript实现消灭星星小游戏简单版
Nov 15 #Javascript
js滚轮事件兼容性问题需要注意哪些
Nov 15 #Javascript
禁用backspace网页回退功能的实现代码
Nov 15 #Javascript
You might like
PHP 杂谈《重构-改善既有代码的设计》之一 重新组织你的函数
2012/04/09 PHP
Yii使用find findAll查找出指定字段的实现方法
2014/09/05 PHP
PHP采用get获取url汉字出现乱码的解决方法
2014/11/13 PHP
ThinkPHP中公共函数路径和配置项路径的映射分析
2014/11/22 PHP
php在linux下检测mysql同步状态的方法
2015/01/15 PHP
php+xml结合Ajax实现点赞功能完整实例
2015/01/30 PHP
json 实例详细说明教程
2009/10/31 Javascript
ExtJS Ext.MessageBox.alert()弹出对话框详解
2010/04/02 Javascript
SyntaxHighlighter语法高亮插件使用说明
2011/08/14 Javascript
setInterval()和setTimeout()的用法和区别示例介绍
2013/11/17 Javascript
javascript里使用php代码实例
2014/12/13 Javascript
jquery解决客户端跨域访问问题
2015/01/06 Javascript
jQuery中innerHeight()方法用法实例
2015/01/19 Javascript
jquery实现简单的自动播放幻灯片效果
2015/06/13 Javascript
基于JavaScript创建动态Dom
2015/12/08 Javascript
通过node-mysql搭建Windows+Node.js+MySQL环境的教程
2016/03/01 Javascript
JS实现队列与堆栈的方法
2016/04/21 Javascript
jQuery ready()和onload的加载耗时分析
2016/09/08 Javascript
jQuery插件zTree实现删除树节点的方法示例
2017/03/08 Javascript
jQuery插件FusionWidgets实现的Bulb图效果示例【附demo源码下载】
2017/03/23 jQuery
Javascript调试之console对象——你不知道的一些小技巧
2017/07/10 Javascript
node.js+captchapng+jsonwebtoken实现登录验证示例
2017/08/17 Javascript
Angular模版驱动表单的使用总结
2018/05/05 Javascript
在Vant的基础上封装下拉日期控件的代码示例
2018/12/05 Javascript
JS实现可视化音频效果的实例代码
2020/01/16 Javascript
[48:38]DOTA2亚洲邀请赛 3.31 小组赛 B组 Mineski vs Secret
2018/03/31 DOTA
OpenCV 边缘检测
2019/07/10 Python
如何通过python的fabric包完成代码上传部署
2019/07/29 Python
Python线程协作threading.Condition实现过程解析
2020/03/12 Python
Python 利用flask搭建一个共享服务器的步骤
2020/12/05 Python
一款html5 canvas实现的图片玻璃碎片特效
2014/09/11 HTML / CSS
耐克美国官网:Nike.com
2016/08/01 全球购物
学前教育毕业生自荐信
2013/10/29 职场文书
四年大学自我鉴定
2014/02/17 职场文书
2015年八一建军节慰问信
2015/03/23 职场文书
mysql sum(if())和count(if())的用法说明
2022/01/18 MySQL