一 摘要
1 nginx 安装和配置
2 nginx 图片缩略模块image_filter安装和配置
3 image_filter和fastdfs 模块整合
二 详细介绍
1 http_image_filter_module 介绍
http_image_filter_module是nginx提供的集成图片处理模块,支持nginx-0.7.54以后的版本,在网站访问量不是很高磁盘有限不想生成多余的图片文件的前提下可,就可以用它实时缩放图片,旋转图片,验证图片有效性以及获取图片宽高以及图片类型信息。
安装2 安装nginx http_image_filter_module模块
a 前置任务安装gd-devel
#gd-devel 是HttpImageFilterModule模块所依赖的
# yum -y install gd-develb 安装 nginx
#将http_image_filter_module包含进来
# cd /usr/local/src/nginx
# ./configure --user=www --group=www --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module --with-http_realip_module --add-module=/usr/local/src/fastdfs/fastdfs-nginx-module/src--with-http_image_filter_module
# make && make install
c 如果nginx已经安装了 (只需要查看有没有安装 http_image_filter_module)
# /usr/local/nginx/sbin/nginx -V
nginx version: nginx/1.5.0
built by gcc 4.4.7 20120313 (Red Hat 4.4.7-17) (GCC)
TLS SNI support enabled
configure arguments: --user=www --group=www --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module --with-http_realip_module --add-module=/usr/local/src/nginx/fastdfs-nginx-module/src
在configure arguments:后面显示的原有的configure参数如下:
configure arguments: --prefix=/usr/local/nginx --with-http_stub_status_module
#或者arguments:后面什么都没有那么就应该切换到源码包:
cd /usr/local/src/nginx-1.9.9 你的源码放在那,就cd到那里。
#我们的新配置信息就应该这样写:
./configure --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_image_filter_module
#运行上面的命令即可,等配置完 成后,运行命令
make
#这里不要进行make install,否则就是覆盖安装
#然后备份原有已安装好的nginx
cp /usr/local/nginx/sbin/nginx /usr/local/nginx/sbin/nginx.bak
#然后将刚刚编译好的nginx覆盖掉原有的nginx(这个时候nginx需要要停止掉)
cp ./objs/nginx /usr/local/nginx/sbin/
然后启动nginx,仍可以通过命令查看模块是否已经加入成功
/usr/local/nginx/sbin/nginx -V
3 nginx 中配置image_filter(没有和fastdfs整合的)
a http_image_filter_module 简单介绍
image_filter off;
#关闭模块
image_filter test;
#确保图片是jpeg gif png否则返415错误
image_filter size;
#输出有关图像的json格式:例如以下显示{ "img" : { "width": 100, "height": 100, "type": "gif" } } 出错显示:{}
image_filter rotate 90|180|270;
#旋转指定度数的图像,參数能够包括变量,单独或一起与resize crop一起使用。
image_filter resize width height;
#缩放图片,等比例缩放,出错415,參数值可包括变量,能够与rotate一起使用,则两个一起生效。
image_filter crop width height;
#截取图片的一部分,从左上角开始截取,尺寸写小了,图片会被剪切
image_filter_buffer 10M;
#设置读取图像缓冲的最大大小,超过则415错误。
image_filter_interlace on;
#假设启用,终于的图像将被交错。对于JPEG,终于的图像将在“渐进式JPEG”格式。
image_filter_jpeg_quality 95;
#设置变换的JPEG图像的期望质量。可接受的值是从1到100的范围内。较小的值通常意味着既降低图像质量,降低数据传输,推荐的最大值为95。參数值能够包括变量。
image_filter_sharpen 100;
#添加了终于图像的清晰度。锐度百分比能够超过100。零值将禁用锐化。參数值能够包括变量。
image_filter_transparency on;
#定义是否应该透明转换的GIF图像或PNG图像与调色板中指定的颜色时,能够保留。透明度的损失将导致更好的图像质量。在PNG的Alpha通道总是保留透明度。
b http_image_filter_module 配置
vi /usr/local/nginx/conf/nginx.conf
location ~* /img {
root /data0;
image_filter resize 150 100;
image_filter rotate 90;
}
4 fastdfs整合 image_filter
location ~ /group1/M00/(.*)_([0-9]+)x([0-9]+)\.(jpg|gif|png){
root /home/fdfsdata/data;
ngx_fastdfs_module;
set $w $2;
set $h $3;
if ($h != "0") {
# rewrite /group1/M00/(.+)_(\d+)x(\d+)\.(jpg|gif|png)$ /group1/M00/$1.$4 last; 如果是last if 括号外的后续代码就不执行了
rewrite group1/M00(.+)_(\d+)x(\d+)\.(jpg|gif|png)$ group1/M00$1.$4 break;
}
if ($w != "0") {
rewrite /group1/M00/(.+)_(\d+)x(\d+)\.(jpg|gif|png)$ /group1/M00/$1.$4 break;
}
image_filter crop $w $h;
image_filter_buffer 2M;
}
location ~ group1/M00/(.+)\.?(.+){
alias /home/fastdata/data;
ngx_fastdfs_module;
}
#a.拦截图片,如果宽度w不为空,就rewrite重定向到“/image/resize/group1/M00”,
#让第2个配置,执行 image_filter resize 100 100,获得缩略图。
#b.如果w为空,直接获得原图。
5 举例
http://ip:port/group1/M00/00/00/KmC4VFY7GsiATWTJAAA3vrrOOWM943.jpg
裁剪后的链接
http://ip:port/group1/M00/00/00/KmC4VFY7GsiATWTJAAA3vrrOOWM943_100x30.jpg
三 总结
生成缩略是个消耗cpu的操作,如果访问量比较大的站点,最好考虑使用程序生成缩略图到硬盘上,
或者在前端加上cache或者使用CDN。所以下面我们配置将生成的缩略图保存到硬盘供下次访问。
不一定要非要用Nginx的image_filter模块实现缩略图。
也可以用程序控制,比如上传图片的时候,实时生成多种尺寸的图片,存到Fastdfs。
优点和缺点,还是经典的“时间”和“空间”问题
四 参考
FastDFS组合nginx的http_image_filter_module建立的图片服务器(最关键,可行方法,在帖子的最后面)
http://bbs.chinaunix.net/thread-4058548-1-1.html
nginx生成缩略图配置 – ttlsa教程系列之nginx(参考)
http://www.ttlsa.com/nginx/nginx-modules-image_filter_module/
Nginx国人开发缩略图模块(ngx_image_thumb)(参考,和上面的类似)
http://www.ttlsa.com/nginx/nginx-modules-ngx_image_thumb/
Nginx图片剪裁模块探究 http_image_filter_module
http://cwtea.blog.51cto.com/4500217/1333142
nginx之location配置
http://blog.csdn.net/hellochenlian/article/details/44655547