当前位置：首页 > 资讯 > 技术文档

在Nginx中配置image filter模块来实现动态生成缩略图

时间：2020-01-25 09:54 编辑：来源：阅读：
扫一扫，手机访问

摘要：在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 - 根据设置按比例得减小图像，比如100*100的图片，而设置是50*25，减小后的图片为25*25。如果你只想设置一个维度，可以用“-”代替。出错时返回415。 crop - 根据设置按比例得减小图像，然后裁剪成跟设置一样大小的图片。比如100*100的图片，而设置是50*25，减小后的图片为50*50，Nginx会选取中间高度25的像素，形成50*25的图片，所以图片会有缺失。如果你只想设置一个维度，可以用“-”代替。出错时返回415。语法: image_filter_buffer size 默认值: image_filter_buffer 1M 可出现的位置: http, server, location 该指令设置单图片缓存的最大值，如果过滤的图片大小超过缓存大小，会报错返回415。现在开始时重点：有了如上认识再配合locaiont、if、image_filter 就可以让nginx动态生成缩略图了。假设你的图片位于/img目录下访问缩略图方式 http://www.1sucai.cn/img/9GUMJR7200AJ0003_90x90.jpg 访问原图方式 http://www.1sucai.cn/img/9GUMJR7200AJ0003_90x0.jpg http://www.1sucai.cn/img/9GUMJR7200AJ0003_0x50.jpg http://www.1sucai.cn/img/9GUMJR7200AJ0003_0x0.jpg http://www.1sucai.cn/img/9GUMJR7200AJ0003.jpg 添加如下配置到server上下文即可

    location ~* /img/(.+)_(d+)x(d+).(jpg|gif|png)$ {      
      set $h $2;
      set $w $3;
      if ($h = "0") {
        rewrite /img/(.+)_(d+)x(d+).(jpg|gif|png)$ /img/$1.$4 last;
      }
      if ($w = "0") {
        rewrite /img/(.+)_(d+)x(d+).(jpg|gif|png)$ /img/$1.$4 last;
      }

      #根据给定的长宽生成缩略图
      image_filter resize $h $w;
      #原图最大2M，要裁剪的图片超过2M返回415错误，需要调节参数image_filter_buffer 
      image_filter_buffer 2M;             
      
      #error_page 415       /img/notfound.jpg;
      try_files /img/$1.$4 /img/notfound.jpg; 
    }

    location ~* /img {
      
    }

生成缩略图只是image_filter功能中的一个，它一共支持4种参数： test:返回是否真的是图片 size:返回图片长短尺寸 corp:截取图片的一部分 resize:缩放图片

location ~ ^/test/(.*)$ {
      image_filter size;
      root  /var/www/_xxx;
      index index.html index.htm;
    }

输出信息类似：

{ "img" : { "width": 1024, "height": 537, "type": "jpeg" } }

是一个JSON，压力测试了一下，还是很给力，500个并发，CPU占用在17%左右。

全部评论(0)

上一篇：windows下nginx的安装使用及解决80端口被占用nginx不能启动的问题
下一篇：使用MongoDB分析Nginx日志的方法详解

资讯排行榜
更多>>