【原创分享】Nodejs跨平台轻量级图片编解码库【增加Jpeg质量调整】

精华

Yyourke发布于13 年前最后回复8 年前|68 回复50021 浏览0 收藏

var images = require("images");

images("input.jpg")                     //加载图像文件
    .size(400)                          //等比缩放图像到400像素宽
    .draw(images("logo.png"), 10, 10)   //在(10,10)处绘制Logo
    .save("output.jpg", {               //保存图片到文件,图片质量为50
        quality : 50
	});

Features 功能特性

轻量级：无需安装任何图像处理库。
跨平台：Windows下发布了编译好的.node文件,下载就能用。
方便用：jQuery风格的API，简单可依赖。

Installation 安装

`$ npm install images`

API 接口

node-images 提供了类似jQuery的链式调用API,您可以这样开始:

/* 从指定文件加载并解码图像 */
images(file)

/* 创建一个指定宽高的透明图像 */
images(width, height)

/* 从Buffer数据中解码图像 */
images(buffer[, start[, end]])

/* 从另一个图像中复制区域来创建图像 */
images(image[, x, y, width, height])

.fill(red, green, blue[, alpha])

以指定颜色填充图像 eg:images(200, 100).fill(0xff, 0x00, 0x00, 0.5)

.draw(image, x, y)

在当前图像( x , y )上绘制 image 图像

.encode(type[, config])

以指定格式编码当前图像到Buffer，config为图片设置，目前支持设置JPG图像质量 eg:images("input.png").encode("jpg", {operation:50}) 返回填充好的Buffer 注意:该操作将会切断调用链
参考:.save(file[, type[, config]])

.save(file[, type[, config]])

编码并保存当前图像到 file ,如果type未指定,则根据 file 自动判断文件类型，config为图片设置，目前支持设置JPG图像质量 eg:images("input.png").save("output.jpg", {operation:50})

.size([width[, height]])

获取或者设置图像宽高，如果height未指定，则根据当前宽高等比缩放

.width([width])

获取或设置图像宽度

.height([height])

获取或设置图像高度

images.setLimit(width, height)

设置库处理图片的大小限制,设置后对所有新的操作生效(如果超限则抛出异常)。

查看回复

beyond5959#1·10 年前

咦，可以用来加水印，mark。

brainsz#2·10 年前

压缩完之后。。保存。方向为什么改变了呢？。。就是本来应该是长816，宽612，。。。但是save之后。。反了

NextZeus#3·10 年前

mark

robert7git#4·10 年前

为什么会有锯齿？怎么取消锯齿呢

undeadway#5·10 年前

发现太迟，关注！

blackjack#6·10 年前

真心不错

hylin#7·13 年前

支持，希望lz多新增些功能，丰富了，换用你的

xieccy#8·13 年前

不错，很实用的功能

yourke#9·13 年前

引用 hylin支持，希望lz多新增些功能，丰富了，换用你的

增加了调整图片大小的功能，计划再做Jpg格式的编码。还有什么需求呢？ @hylin

hylin#10·13 年前

引用 hylin支持，希望lz多新增些功能，丰富了，换用你的

@yourke 增加其它常用格式当然是必须的，比如jpg，bmp，gif等另外，能在图片上直接绘制文字，设置图片质量（上传时降低质量减小大小），旋转等等，呵呵

DoubleSpout#11·13 年前

引用 DoubleSpout这个库真心不错，建议能加上裁剪和另存为指定格式的功能持续关注

@a272121742 我没做个类似功能的东西啊，我只是做了个生成验证码的

yourke#12·13 年前

引用 udbiawdif编译好的.node文件放在哪个位置？我看到LIB目录下全是JS，不知道要把它摆哪儿才能被 require

就放到 build/Release 下就好。

ijse#13·13 年前

终于有WIN下可以直接使用的了。。

不过，能加上绘制文字的功能吗？

youxiachai#14·13 年前

images@1.1.3 install D:\imagestest\node_modules\images node install.js

events.js:72 throw er; // Unhandled 'error' event ^ Error: spawn ENOENT at errnoException (child_process.js:975:11) at Process.ChildProcess._handle.onexit (child_process.js:766:34) npm ERR! images@1.1.3 install: node install.js npm ERR! cmd "/c" "node install.js" failed with 8 npm ERR! npm ERR! Failed at the images@1.1.3 install script. npm ERR! This is most likely a problem with the images package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! node install.js npm ERR! You can get their info via: npm ERR! npm owner ls images npm ERR! There is likely additional logging output above.

npm ERR! System Windows_NT 6.1.7601 npm ERR! command "C:\Program Files\nodejs\\node.exe" "C:\Program Files\nod ejs\node_modules\npm\bin\npm-cli.js" "install" "images" npm ERR! cwd D:\imagestest npm ERR! node -v v0.10.4 npm ERR! npm -v 1.2.18 npm ERR! code ELIFECYCLE npm ERR! npm ERR! Additional logging details can be found in: npm ERR! D:\imagestest\npm-debug.log npm ERR! not ok code 0

D:\imagestest>

leapon#15·13 年前

transparency support?

leapon#16·13 年前

在ubuntu, macosx上安装出错。缺啥支持包？

$ npm install images
npm http GET https://registry.npmjs.org/images
npm http 200 https://registry.npmjs.org/images
npm http GET https://registry.npmjs.org/images/-/images-1.1.3.tgz
npm http 200 https://registry.npmjs.org/images/-/images-1.1.3.tgz

> images@1.1.3 install /Users/yliu0/dev/node_modules/images
> node install.js

  CXX(target) Release/obj.target/images/src/Image.o
  CXX(target) Release/obj.target/images/src/Png.o
../src/Png.cc:10:10: fatal error: 'png.h' file not found
#include <png.h>
         ^
1 error generated.
make: *** [Release/obj.target/images/src/Png.o] Error 1
gyp ERR! build error 
gyp ERR! stack Error: `make` failed with exit code: 2

yourke#17·13 年前

引用 leapontransparency support?

嗯，支持Alpha透明通道。

yourke#18·13 年前

引用 leapon在ubuntu, macosx上安装出错。缺啥支持包？ $ npm install images npm http GET https://registry.npmjs.org/images ...

非windows平台下依赖 giflib,libjpeg-turbo,libpng,zlib，你可以尝试在MAC下编译一下这些库。

myy#19·13 年前

感谢分享！

freemem#20·13 年前

相当棒，收藏了。

yourke#21·13 年前

引用 shaniu00cenntos5.9报错 images@1.1.3 install /opt/node modules/images node install.js gyp http GET http://n...

非win32平台下依赖 giflib,libjpeg-turbo,libpng 这些库。 ../src/Png.cc:10:17: 警告：png.h：没有那个文件或目录 看样子是缺少头文件，可能需要安装相应的 dev 版本

Pana#22·13 年前

支持图片的裁剪和缩放吗

Pana#23·13 年前

另外为什么好多人使用都报错呢, 确定跨平台吗

yourke#24·13 年前

引用 Pana支持图片的裁剪和缩放吗

嗯，支持

var from = images("input.jpg");
images(from, 0, 0, 200, 100) // 从input.jpg复制200x100的矩形区域
    .size(50)                //等比缩放图像到50像素宽
    .save("output.jpg",{     //保存到output.jpg,图片质量为50
        quality : 50
    });

yourke#25·13 年前

引用 Pana另外为什么好多人使用都报错呢, 确定跨平台吗

嗯，是跨平台的， win32平台下直接发布了.node库文件无需编译，可以直接使用。其他平台下需要从源码编译。依赖 giflib,libjpeg-turbo,libpng 这几个库，报错大都是因为环境配置问题。

0005323#26·13 年前

你好我想在我的odroid上使用你这个插件可否给我提供一下帮助,qq370951629

dangtuo#27·13 年前

npm install images npm http GET https://registry.npmjs.org/images npm http 304 https://registry.npmjs.org/images

images@1.1.3 install /root/test/node_modules/images node install.js

make: Entering directory /root/test/node_modules/images/build' CXX(target) Release/obj.target/images/src/Image.o CXX(target) Release/obj.target/images/src/Png.o ../src/Png.cc: In function ‘ImageState decodePng(PixelArray*, ImageData*)’: ../src/Png.cc:94: 错误：‘png_const_bytep’在此作用域中尚未声明 make: *** [Release/obj.target/images/src/Png.o] 错误 1 make: Leaving directory /root/test/node_modules/images/build' gyp ERR! build error gyp ERR! stack Error: make failed with exit code: 2 gyp ERR! stack at ChildProcess.onExit (/usr/local/node/0.10.21/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:267:23) gyp ERR! stack at ChildProcess.EventEmitter.emit (events.js:98:17) gyp ERR! stack at Process.ChildProcess._handle.onexit (child_process.js:789:12) gyp ERR! System Linux 2.6.32-358.6.2.el6.x86_64 gyp ERR! command "node" "/usr/local/node/0.10.21/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" gyp ERR! cwd /root/test/node_modules/images gyp ERR! node -v v0.10.21 gyp ERR! node-gyp -v v0.10.10 gyp ERR! not ok npm ERR! weird error 1 npm ERR! not ok code 0

请问Linux下如何编译？

XadillaX#28·13 年前

可惜只是jpg啊，如果支持比较多的格式就好了

png，gif等

XadillaX#29·13 年前

引用 XadillaX可惜只是jpg啊，如果支持比较多的格式就好了 png，gif等

好像我断章取义了，貌似是可以用于png之类的？这我到时候得研究研究，说不定能弄到项目的资源服务中。

usherwong#30·12 年前

windows平台安装报错，现在这个包还在维护吗？
E:\story>npm install images

npm http GET https://registry.npmjs.org/images

npm http 304 https://registry.npmjs.org/images

images@1.1.3 install E:\story\node_modules\images

node install.js

events.js:72

    throw er; // Unhandled 'error' event

          ^

Error: spawn ENOENT

at errnoException (child_process.js:988:11)

at Process.ChildProcess._handle.onexit (child_process.js:779:34)

npm ERR! images@1.1.3 install: `node install.js
npm ERR! Exit status 8

npm ERR!

npm ERR! Failed at the images@1.1.3 install script.

npm ERR! This is most likely a problem with the images package,

npm ERR! not with npm itself.

npm ERR! Tell the author that this fails on your system:

npm ERR! node install.js

npm ERR! You can get their info via:

npm ERR! npm owner ls images

npm ERR! There is likely additional logging output above.

npm ERR! System Windows_NT 6.1.7601

npm ERR! command "C:\Program Files\nodejs\\node.exe" "C:\Program Files\nod ejs\node_modules\npm\bin\npm-cli.js" "install" "images"

npm ERR! cwd E:\story

npm ERR! node -v v0.10.26

npm ERR! npm -v 1.4.3

npm ERR! code ELIFECYCLE

npm ERR!

npm ERR! Additional logging details can be found in:

npm ERR! E:\story\npm-debug.log

npm ERR! not ok code 0

daizisheng#31·12 年前

可惜没有像素级的处理接口:(

bibiuc#32·12 年前

这个东西需要python2.4以上3.0以下的编译环境

wanglihui#33·12 年前

看了readme最终也没有明白此API是否基于promise，尝试调用then告诉我不支持，貌似也没有提供支持回调方法，望楼主详细说明呀

yourke#34·12 年前

引用 wanglihui看了readme最终也没有明白此API是否基于promise，尝试调用then告诉我不支持，貌似也没有提供支持回调方法，望楼主详细说明呀

@wanglihui 不是基于 promise 的，这个库的所有方法基本都是同步的。如果要实现异步读取和保存文件，可以这样

//异步读取
fs.readFile("a.jpg", function(data){
    var img = image(data);
	// img.XXXX()
	
	var saveData = img.encode("jpg", {operation:50});
	//异步写入
	fs.writeFile("b.jpg", saveData, function(){
	    //写入完成的回调
	});
});

stepjacky__legacy_530e086f3c90760f0d01d5f8#35·11 年前

楼主,请问这个库还在更新吗,我正好需要一个

peijian708#36·11 年前

收藏自豪地采用 CNodeJS ionic

Jekin6#37·11 年前

支持楼主！好东西收藏了发自 CNodeJs ionic

usherwong#38·11 年前

支持水印吗

stepjacky__legacy_530e086f3c90760f0d01d5f8#39·11 年前

这个东西太好了,我用在项目里,不过出现一个问题,请楼主解惑 @yourke 我部署到不能联网的机器上时,发现启动网站报错,说需要下载一个dll,我是winserver2003 请问这个文件能否离线下好后直接用,由于安全原因客户那里不允许上网!

leadwit#40·13 年前

希望加入文字水印这样才比较完善

leadwit#41·13 年前

引用 ijse终于有WIN下可以直接使用的了。。不过，能加上绘制文字的功能吗？

顶一个绘制文字功能

leadwit#42·13 年前

引用 hylin支持，希望lz多新增些功能，丰富了，换用你的

@yourke 顶一个绘制文字功能

rekey#43·13 年前

依然木有配置成功.

同centos5.9,那些包我似乎都装了.

yuhuaren#44·12 年前

F:\nodejs\letu>npm install npm http GET https://registry.npmjs.org/images npm http 304 https://registry.npmjs.org/images

images@1.1.3 install F:\nodejs\letu\node_modules\images node install.js

events.js:72 throw er; // Unhandled 'error' event ^ Error: spawn ENOENT at errnoException (child_process.js:980:11) at Process.ChildProcess._handle.onexit (child_process.js:771:34) npm ERR! weird error 8 npm ERR! not ok code 0

yourke#45·11 年前

引用 stepjacky__legacy_530e086f3c90760f0d01d5f8楼主,请问这个库还在更新吗,我正好需要一个

@stepjacky 在啊。 49 downloads in the last day 370 downloads in the last week 1,110 downloads in the last month

zcl521ss#46·13 年前

arrowing#47·13 年前

需要安装 imagemagick 之类的图形软件么？

yourke#48·13 年前

引用 arrowing需要安装 imagemagick 之类的图形软件么？

不需要，直接封装的libpng,jpeglib等图像编解码库，windows下发布的是编译后的文件，不需要再次编译。

DoubleSpout#49·13 年前

这个库真心不错，建议能加上裁剪和另存为指定格式的功能~持续关注

yourke#50·13 年前

引用 DoubleSpout这个库真心不错，建议能加上裁剪和另存为指定格式的功能持续关注

裁减可以通过 copyFromImage(image, x, y, width, height) 来实现；目前已经支持保存为PNG32位格式，其他格式支持会尽快加上。

jsw0528#51·13 年前

为什么是 new images.Image()，以后还会有其他API？

yourke#52·13 年前

引用 jsw0528为什么是 new images.Image()，以后还会有其他API？

嗯，确实有点不好用，改成类似jQuery的链式调用方式了，也不需要显示的调用new images.Image()了，你看行不。

jsw0528#53·13 年前

引用 jsw0528为什么是 new images.Image()，以后还会有其他API？

@yourke Not bad

a272121742#54·13 年前

引用 DoubleSpout这个库真心不错，建议能加上裁剪和另存为指定格式的功能持续关注

跟你那个比怎么样？

yourke#55·13 年前

引用 hylin支持，希望lz多新增些功能，丰富了，换用你的

@hylin 嗯，已经做了jpg的编码和质量调整了。其他格式尽快加上，为了保持轻量，绘制文本和高级的图像处理考虑用插件的形式来扩展 ^_^。

udbiawdif#56·13 年前

编译好的.node文件放在哪个位置？我看到LIB目录下全是JS，不知道要把它摆哪儿才能被 require

shaniu00#57·13 年前

cenntos5.9报错

images@1.1.3 install /opt/node_modules/images node install.js

gyp http GET http://nodejs.org/dist/v0.10.7/node-v0.10.7.tar.gz gyp http 200 http://nodejs.org/dist/v0.10.7/node-v0.10.7.tar.gz make: Entering directory /opt/node_modules/images/build' CXX(target) Release/obj.target/images/src/Image.o CXX(target) Release/obj.target/images/src/Png.o ../src/Png.cc:10:17: 警告：png.h：没有那个文件或目录 ../src/Png.cc:23: 错误：变量或字段 ‘read_from_memory’ 声明为 void ../src/Png.cc:23: 错误：‘png_structp’ 在此作用域中尚未声明 ../src/Png.cc:23: 错误：‘png_bytep’ 在此作用域中尚未声明 ../src/Png.cc:23: 错误：‘png_size_t’ 在此作用域中尚未声明 ../src/Png.cc:23: 错误：initializer 表达式列表被看作复合表达式 ../src/Png.cc:23: 错误：expected ‘,’ or ‘;’ before ‘{’ token make: *** [Release/obj.target/images/src/Png.o] 错误 1 make: Leaving directory /opt/node_modules/images/build' gyp ERR! build error gyp ERR! stack Error: make failed with exit code: 2 gyp ERR! stack at ChildProcess.onExit (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:267:23) gyp ERR! stack at ChildProcess.EventEmitter.emit (events.js:98:17) gyp ERR! stack at Process.ChildProcess._handle.onexit (child_process.js:789:12) gyp ERR! System Linux 2.6.18-348.6.1.el5 gyp ERR! command "node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" gyp ERR! cwd /opt/node_modules/images gyp ERR! node -v v0.10.7 gyp ERR! node-gyp -v v0.9.5 gyp ERR! not ok npm ERR! weird error 1 npm ERR! not ok code 0

Pana#58·13 年前

顶下, 持续关注这个module, 顶起楼主

wldlzt#59·13 年前

这个与gm有何不同?看上去挺像的

yourke#60·13 年前

引用 wldlzt这个与gm有何不同?看上去挺像的

这个不需要安装 GraphicsMagick 或者 ImageMagick.

wldlzt#61·13 年前

引用 wldlzt这个与gm有何不同?看上去挺像的

@yourke 我还是比较信任GraphicsMagick的，毕竟性能啊各方便都属上乘，安装一下也不难。。。

sumory#62·13 年前

引用 leapon在ubuntu, macosx上安装出错。缺啥支持包？ $ npm install images npm http GET https://registry.npmjs.org/images ...

@yourke ubuntu上找不到这些包

hedgehog#63·13 年前

麻烦问下：我从github直接下载，然后node install.js 提示CreateProcessW: 这个，然后就没动静了。。这个是什么问题？

gws321#64·12 年前

需要的几个功能木有啊。。。 1.文字。。 2.返回图片流。。

zcfrank1st__legacy_536aefd99968d7613302918d#65·12 年前

能获取图片的灰度吗

dulante#66·12 年前

不错啊　现在有文字绘制功能了吗

winddriver#67·12 年前

要是能支持DrawText就好了，就能实现文字水印了

参与回复

登录后即可参与回复。登录

【原创分享】Nodejs跨平台轻量级图片编解码库【增加Jpeg质量调整】

Features 功能特性

Installation 安装

API 接口

.fill(red, green, blue[, alpha])

.draw(image, x, y)

.encode(type[, config])

.save(file[, type[, config]])

.size([width[, height]])

.width([width])

.height([height])

images.setLimit(width, height)

回复 (67)