用脑思考,用心琢磨,用行动证实 [登录·注册]

吕滔博客

首页 开发 运维 工具 摄影

为nginx/tengine增加自动缩略图功能 ngx_image_model 和 http-image-filter-model的使用

环境配置 memory 发布于November 29, 2016 标签: Nginx

网上的教程很多~我不多说没用的~本文环境是tengine
ngx_image_thumb 是国人开发的一个Nginx扩展模块,功能比nginx自带的http_image_filter_module强大!例如水印功能等~~

ngx_image_thumb 项目地址:https://github.com/3078825/nginx-image/

安装:
ngx_image_thumb编译安装

./configure --add-module=./nginx-image-master ......

dso

/usr/locatl/tengine/sbin/dso_tool --add-module=./nginx-image-master

http_image_filter_module编译安装,添加模块即可,nginx自带模块

./configure --with-http_image_filter_module  ......

使用:
dso安装的image-thumb模块,需要在nginx.conf中调用.so文件

dso {
        load ngx_http_image_module.so;
}  

image-thumb使用:

location .*\.(png|jpg|gif){
image on;
image_output on;
}

其它参数:

image on/off 是否开启缩略图功能,默认关闭
image_backend on/off 是否开启镜像服务,当开启该功能时,请求目录不存在的图片(判断原图),将自动从镜像服务器地址下载原图
image_backend_server 镜像服务器地址
image_output on/off 是否不生成图片而直接处理后输出 默认off
image_jpeg_quality 75 生成JPEG图片的质量 默认值75
image_water on/off 是否开启水印功能
image_water_type 0/1 水印类型 0:图片水印 1:文字水印
image_water_min 300 300 图片宽度 300 高度 300 的情况才添加水印
image_water_pos 0-9 水印位置 默认值9 0为随机位置,1为顶端居左,2为顶端居中,3为顶端居右,4为中部居左,5为中部居中,6为中部居右,7为底端居左,8为底端居中,9为底端居右
image_water_file 水印文件(jpg/png/gif),绝对路径或者相对路径的水印图片
image_water_transparent 水印透明度,默认20
image_water_text 水印文字 "Power By Vampire"
image_water_font_size 水印大小 默认 5
image_water_font 文字水印字体文件路径
image_water_color 水印文字颜色,默认 #000000

调用:

http://127.0.0.1/test.jpg!c300x200.jpg 将会 生成/输出 test.jpg 300x200 的缩略图
其中 c 是生成图片缩略图的参数, 300 是生成缩略图的 宽度 200 是生成缩略图的 高度

C 参数按请求宽高比例从图片高度 10% 处开始截取图片,然后缩放/放大到指定尺寸( 图片缩略图大小等于请求的宽高 )
M 参数按请求宽高比例居中截图图片,然后缩放/放大到指定尺寸( 图片缩略图大小等于请求的宽高 )
T 参数按请求宽高比例按比例缩放/放大到指定尺寸( 图片缩略图大小可能小于请求的宽高 )
W 参数按请求宽高比例缩放/放大到指定尺寸,空白处填充白色背景颜色( 图片缩略图大小等于请求的宽高 )

image-filter使用:

location .*\.(png|jpg|gif){
     image_filter   可选参数: (off | test | size | rotate 90/180/270 | resize width height | crop width height)
     image_filter_buffer  默认 1M (超过1M的图片返回415错误)
     image_filter_interlace ( on | off) 如果启用,最终的图像将被交错。对于JPEG,最终的图像将在“渐进式JPEG”格式
     image_filter_jpeg_quality  (0-100数值) 设置变换的JPEG图像的期望质量。
     image_filter_sharpen  增加了最终图像的清晰度 ,锐度百分比可以超过100。零值将禁用锐化。参数值可以包含变量。
     image_filter_transparency (on | off) 定义是否应该透明转换的GIF图像或PNG图像与调色板中指定的颜色时,可以保留。透明度的损失将导致更好的图像质量。在PNG的Alpha通道总是保留透明度
     image_filter_webp_quality  (0-100数值) 设置webp图片质量
}

案例:
1.通过增加参数缩放或裁剪图片

#resize裁剪模式配置
location ~* /(.+)-resize(d+)x(d+).(jpg|gif|png)$ {
            set $width $2;
            set $height $3;
            #带长宽的图片实际是不存在的,所以重写到真实图片上
            rewrite /(.+)-resize(d+)x(d+).(jpg|gif|png)$ /$1.$4 break;
            #生成缩略图
            image_filter resize $width $height;
            image_filter_buffer 2M;
            image_filter_jpeg_quality 80;
            image_filter_transparency on;
            #如果找不到图片,将返回如下预设图片(请放置正确的图片)
            try_files /$1.$4  /notfound.jpg;
   }

#crop裁剪模式配置
location ~* /(.+)-crop(d+)x(d+).(jpg|gif|png)$ {
            set $width $2;
            set $height $3;
            #带长宽的图片实际是不存在的,所以重写到真实图片上
            rewrite /(.+)-crop(d+)x(d+).(jpg|gif|png)$ /$1.$4 break;
            #生成缩略图
            image_filter crop $width $height;
            image_filter_buffer 2M;
            image_filter_jpeg_quality 80;
            image_filter_transparency on;
            #插入一个头部,测试中证明缩略图来自Nginx,测试无误可随时删除
            #如果找不到图片,将返回如下预设图片(请放置正确的图片)
            try_files /$1.$4  /notfound.jpg;
  }

2.根据图片后自带width&height参数缩放

location ~ .*.(gif|jpg|jpeg|png|bmp)$ {
            set $width '';
            set $height '';
            #将参数赋值给宽和高
            set $width $arg_width;
            set $height $arg_height;    
            #当未设置高度时,仅使用宽度来进行缩放,可以保证图片的正常比例(适用于文章)
            if ( $height = '' ) {
                set $height '-';
            }
            #当请求的是原图时(即不带参数),则设置宽高维度为”-”
            if ( $width = '' ) {
                set $width '-';
                set $height '-';
            }
            #生成缩略图
            image_filter resize $width $height;
            image_filter_buffer 2M;
            image_filter_jpeg_quality 80;
            image_filter_transparency on;
}

3.在网上看到了另外一种方案,也不错,备忘一下,这是image_filter的

server {
  listen 80 default_server;
  listen 443 ssl http2;

  root /var/www;

  location /uploads {
    expires 7d;
    gzip_static on;

    add_header Cache-Control public;
    add_header X-Pownered "nginx_image_filter";
    # HTTP Response Header 增加 proxy_cache 的命中状态,以便于以后调试,检查问题
    add_header X-Cache-Status $upstream_cache_status;

    proxy_pass http://127.0.0.1/_img/uploads;
    # 将缩略图缓存在服务,避免每次请求都重新生成
    proxy_cache uploads_thumb;
    # 当收到 HTTP Header Pragma: no-cache 的时候,忽略 proxy_cache
    # 此配置能让浏览器强制刷新的时候,忽略 proxy_cache 重新生成缩略图
    proxy_cache_bypass $http_pragma;
    # 由于 Upload 文件一般都没参数的,所以至今用 host + document_uri 作为
    proxy_cache_key "$host$document_uri";
    # 有效的文件,在服务器缓存 7 天
    proxy_cache_valid 200 7d;
    proxy_cache_use_stale error timeout invalid_header updating;
    proxy_cache_revalidate on;
    # 处理 proxy 的 error
    proxy_intercept_errors on;
    error_page   415 = /assets/415.png;
    error_page   404 = /assets/404.png;
  }

  # 原始图片
  location /_img/uploads {
    alias /var/www/uploads/$filename;
    expires 7d;
  }

  # 缩略图
  location ~* /_img/uploads/(.+)!(large|lg|md|sm|xs)$ {
    set $filename /uploads/$1;

    if (-f $filename) {
      break;
    }

    # 根据 URL 地址 ! 后面的图片版本来准备好需要的参数(宽度、高度、裁剪或缩放)
    set $img_version $2;
    set $img_type resize;
    set $img_w    -;
    set $img_h    -;
    if ($img_version = 'large') {
      set $img_type resize;
      set $img_w    1920;
    }
    if ($img_version = 'lg') {
      set $img_type crop;
      set $img_w    192;
      set $img_h    192;
    }
    if ($img_version = 'md') {
      set $img_type crop;
      set $img_w    96;
      set $img_h    96;
    }
    if ($img_version = 'sm') {
      set $img_type crop;
      set $img_w    48;
      set $img_h    48;
    }
    if ($img_version = 'xs') {
      set $img_type crop;
      set $img_w    32;
      set $img_h    32;
    }
    rewrite ^ /_$img_type;
  }

  # 缩放图片的处理
  location /_resize {
    alias /var/www/$filename;
    image_filter resize $img_w $img_h;
    image_filter_jpeg_quality 95;
    image_filter_buffer         20M;
    image_filter_interlace      on;
  }

  # 裁剪图片的处理
  location /_crop {
    alias /var/www$filename;
    image_filter crop $img_w $img_h;
    image_filter_jpeg_quality 95;
    image_filter_buffer         20M;
    image_filter_interlace      on;
  }
}

使用:
Original - https://www.lvtao.net/uploads/photo/2016/b0c898ac6f663544044ca1c2d277b362.jpg
large - https://www.lvtao.net/uploads/photo/2016/b0c898ac6f663544044ca1c2d277b362.jpg!large
lg - https://www.lvtao.net/uploads/photo/2016/b0c898ac6f663544044ca1c2d277b362.jpg!lg
md - https://www.lvtao.net/uploads/photo/2016/b0c898ac6f663544044ca1c2d277b362.jpg!md
sm - https://www.lvtao.net/uploads/photo/2016/b0c898ac6f663544044ca1c2d277b362.jpg!sm
xs - https://www.lvtao.net/uploads/photo/2016/b0c898ac6f663544044ca1c2d277b362.jpg!xs

相关推荐

添加新评论

网站状态

  • 栏目分类:49个
  • 发布文章:1308篇
  • 用户评论:687条
  • 开博至今:3976天

正则速查

[abc] 匹配中括号中的单个字符,如a或b或c
[^abc] 匹配除了a、b、c等字符的其他单个字符
[a-z] 匹配一个字符范围,如a到z
[a-zA-Z] 匹配一个字符范围,如a-z 或 A-Z
^ 匹配行的开始
$ 匹配行的结束
\A 匹配一个字符串的开始
\z 匹配一个字符串的结束
. 匹配任意单个字符
\s 匹配空白字符,如空格,TAB
\S 匹配非空白字符
\d 匹配一个数字
\D 匹配非数字
\w 匹配一个字母
\W 匹配非字幕
\b 匹配字符边界
(...) 引用所有括号中的内容
(a|b) a或者b
a? 零个或多个a
a* 零个或多个a
a+ 1个或多个a
a{3} 3次重复的a
a{3,} 3次或3次以上重复的a
a{3,6} 3到6次重复的a

修正符

/g 查找所有可能的匹配
/i 不区分大小写
/m 多行匹配
/s 单行匹配
/x 忽略空白模式
/e 可执行模式,PHP专有
/A 强制从目标字符串开头匹配
/D 使用$限制结尾字符,则不允许结尾有换行
/U 只匹配最近的一个字符串;不重复匹配

最新回复

  • memory: 这是我3年前玩过一次,当时因为安装完后,发现日常办公还好,但是好...
  • sdf: 想问一下,激活工具激活后,后面会出现提示要再次重新激活吗?
  • memory: 你要用碗装我吗?还是要我把扔的扔进你碗里???!!! &^_^&
  • 薛才杰: 同感,快扔到我的碗里来。。。
  • memory: 要说明一下,在大陆及香港的云主机或VPS,都是不支持的。原因都懂...
  • 历史趣谈LishiQtan: 很好的文章,值得收藏
  • memory: 现在回头看,,,这么烂的代码,也是醉了.
  • memory: 有空试试apache的
  • 脚踏实地: rInfo数组是怎么来的
  • 朋友们: 我都是这么建站的
  • memory: 明眼人.
  • 上官元恒: $lunarInfo数组是怎么来的,这是重点
  • memory: 你知道的太多了...
  • yjl: 这个肯定解决的不是空间的问题,可能是复用的问题,有可能是“站群”的问题
  • Smithd994: Hello! This post could not be wr...
  • memory: controll文件assign ,然后模板文件中直接foreach
  • mike: 你好,yaf怎么使用循环输出数据到模板中