在nginx中利用image_filter动态生成缩略图
先来看一下什么是nginx的image filter模块。
HttpImageFilterModule用来裁剪过大的图片到指定大小,是nginx自带模块,默认不会开启
开启HttpImageFilterModule需要在编译要带上参数 --with-http_image_filter_module
该模块主要有两个指令:
语法:
image_filter (test | size | resize width height | crop width height)
默认是: 无
可出现的上下文: location
该指令指定图像的转化形式:
test - 测试回复是否是JPEG、GIF、或PNG图片(不支持BMP等其他格式),出错时返回415。
size - 返回图片的JSON数据,比如:( "Img": ( "width": 100, "height": 100, "type": "gif"))
resize - 根据设置按比例得减小图像,比如100100的图片,而设置是5025,减小后的图片为2525。如果你只想设置一个维度,可以用“-”代替。出错时返回415。
crop - 根据设置按比例得减小图像,然后裁剪成跟设置一样大小的图片。比如100100的图片,而设置是5025,减小后的图片为5050,Nginx会选取中间高度25的像素,形成50*25的图片,所以图片会有缺失。如果你只想设置一个维度,可以用“-”代替。出错时返回415。
语法: image_filter_buffer size
默认值: image_filter_buffer 1M
可出现的位置: http, server, location
该指令设置单图片缓存的最大值,如果过滤的图片大小超过缓存大小,会报错返回415。
现在开始时重点:
有了如上认识再配合locaiont、if、image_filter 就可以让nginx动态生成缩略图了。
假设你的图片位于/img目录下
访问缩略图方式
http://iw3c.com/images/9GUMJR7200AJ0003_90x90.jpg
访问原图方式
http://iw3c.com/images/9GUMJR7200AJ0003_90x0.jpg
http://iw3c.com/images/9GUMJR7200AJ0003_0x50.jpg
http://iw3c.com/images/9GUMJR7200AJ0003_0x0.jpg
http://iw3c.com/images/9GUMJR7200AJ0003.jpg
添加如下配置到server上下文即可
location ~* /images/(.+)_(d+)x(d+).(jpg|gif|png)$ {
set $h $2;
set $w $3;
if ($h = "0") {
rewrite /images/(.+)_(d+)x(d+).(jpg|gif|png)$ /images/$1.$4 last;
}
if ($w = "0") {
rewrite /images/(.+)_(d+)x(d+).(jpg|gif|png)$ /images/$1.$4 last;
}
#根据给定的长宽生成缩略图
image_filter resize $h $w;
#原图最大2M,要裁剪的图片超过2M返回415错误,需要调节参数image_filter_buffer
image_filter_buffer 2M;
#error_page 415 /images/notfound.jpg;
try_files /images/$1.$4 /images/notfound.jpg;
}
location ~* /images {
}
http://wiki.nginx.org/HttpImageFilterModule
几个其他的规则
匹配全站所有的结尾图片
---------------------------------------------------------
location ~* .(jpg|gif|png)$ {
image_filter resize 500 500;
}
---------------------------------------------------------
匹配某个目录所有图片
---------------------------------------------------------
location ~* /image/.*.(jpg|gif|png)$ {
image_filter resize 500 500;
}
---------------------------------------------------------
再比如用url来指定
---------------------------------------------------------
location ~* (.*.(jpg|gif|png))!(.*)x(.*)$ {
set $width $3;
set $height $4;
rewrite "(.*.(jpg|gif|png))(.*)$" $1;
}
location ~* /image/.*.(jpg|gif|png)$ {
image_filter resize $width $height;
}
---------------------------------------------------------
http://blog.iw3c.com/image/girl.jpg!300x200
自动将原图缩放为300*200的尺寸