12343052 发表于 2018-11-9 09:09:19

Nginx图片剪裁模块探究 http_image_filter_module

  官方地址:http://nginx.org/en/docs/http/ngx_http_image_filter_module.html
  煮酒品茶:前半部安装和官方说明,后半部分实践
  #yum install -y gd-devel
  Install add http_image_filter_module Module
  #./configure --prefix=/usr/local/nginx_image_filter/ --with-http_image_filter_module
  #make && make install
  use:

  off:关闭模块处理
  test:确保图片是jpeg gif png否则返415错误
  size:输出有关图像的json格式:如下显示
  { "img" : { "width": 100, "height": 100, "type": "gif" } }
  出错显示:
  {}
  rotate 90|180|270:旋转指定度数的图像,参数可以包括变量,单独或一起与resize crop一起使用。

  resize>
  resize>
  crop>  #设置读取图像缓冲的最大大小,超过则415错误。

  syntax:image_filter_buffer>  default:
  image_filter_buffer 1M;
  context:http, server, location
  #如果启用,最终的图像将被交错。对于JPEG,最终的图像将在“渐进式JPEG”格式。
  syntax:image_filter_interlace on | off;
  default:
  image_filter_interlace off;
  context:http, server, location
  This directive appeared in version 1.3.15.
  #设置变换的JPEG图像的期望质量。可接受的值是从1到100的范围内。较小的值通常意味着既降低图像质量,减少传输数据,推荐的最大值为95。参数值可以包含变量。
  syntax:image_filter_jpeg_quality quality;
  default:
  image_filter_jpeg_quality 75;
  context:http, server, location
  #增加了最终图像的清晰度。锐度百分比可以超过100。零值将禁用锐化。参数值可以包含变量。
  syntax:image_filter_sharpen percent;
  default:
  image_filter_sharpen 0;
  context:http, server, location
  #定义是否应该透明转换的GIF图像或PNG图像与调色板中指定的颜色时,可以保留。透明度的损失将导致更好的图像质量。在PNG的Alpha通道总是保留透明度。
  syntax:image_filter_transparency on|off;
  default:
  image_filter_transparency on;
  context:http, server, location
  image_filter resize>
  Json:

  品茶:这比例不知道具体怎么算的测一测。
  nginx.conf:
  ---------------------------------------------------
  location ~* /image {
  image_filter resize 200 200;
  }
  ---------------------------------------------------
  测试数据过程:每次重启nginx 和清浏览器缓存并多次刷新

  长>宽

  Test1:





  Test2:





  长 w:
  print nginx.l nginx.l/g
  
else:
  print nginx.w*w w
  image_filter rotate 90 | 180 | 270;
  品茶:只能用这三个值,不然nginx启动报错。分别是左转倒转和右转,逆时针的。
  nginx.conf
  ---------------------------------------------------------
  location ~* /image {
  #image_filter resize 500 500;
  image_filter rotate 90;
  }
  ---------------------------------------------------------
  逆时针90度 :90
  逆时针180度:180
  逆时针270度:270




  那就明显了。
  resize:图片完整,比例缩小。
  crop:图片不完整,但完全按我们提供的来。
  rotate:旋转图片。
  测试一下test
  test:
  { "img" : { "width": 1920, "height": 1200, "type": "jpeg" } }
  test2:
  { "img" : { "width": 1920, "height": 1080, "type": "jpeg" } }
  test3:
  { "img" : { "width": 354, "height": 586, "type": "png" } }
  输出json格式,可以用来调用。
  image_filter_buffer>
  我们试试超过1M的文件
  415 Unsupported Media Type
  品茶:这个值看你怎么设了,因为iphone现在拍的原图基本上是4-8M左右
  image_filter_interlace on
  品茶:渐进式jpeg没懂啥意思
  image_filter_jpeg_quality quality; #quality:1-100
  品茶:这个值控制图片的质量,影响清晰度
  nginx.conf
  -----------------------------------------------------------------
  location ~* /image {
  image_filter_jpeg_quality 20;
  image_filter resize 500 500;
  image_filter_buffer 10M;
  image_filter_interlace on;
  #image_filter rotate 20;
  #image_filter crop 200 200;

  #image_filter>  #image_filter test;
  }
  ------------------------------------------------------------------





  品茶:这就是效果
  image_filter_sharpen percent;
  品茶:锐化比
  image_filter_transparency on|off;
  品茶:透明损失度
  品茶:想了一下写几个规则,可能有用。
  比如匹配全站所有的结尾图片
  ----------------------------------------------
  location ~* \.(jpg|gif|png)$ {
  image_filter resize 500 500;
  }
  ----------------------------------------------
  匹配某个目录所有图片
  ----------------------------------------------
  location ~* /image/.*\.(jpg|gif|png)$ {
  image_filter resize 500 500;
  }
  ----------------------------------------------
  再比如用url来指定
  ---------------------------------------------------
  location ~* (.*\.(jpg|gif|png))!(.*)!(.*)$ {
  set $width      $3;
  set $height   $4;
  rewrite "(.*\.(jpg|gif|png))(.*)$" $1;
  }
  location ~* .*\.(jpg|gif|png)$ {
  image_filter resize $width $height;
  }
  ---------------------------------------------------
  那么效果是:




  品茶:是不是很cool,哈哈,更新完毕了。


页: [1]
查看完整版本: Nginx图片剪裁模块探究 http_image_filter_module