［Nginx］使用nginx的image_filter_module来处理图片

我司APP针对不同尺寸的手机需要展示不同尺寸的图片；同时，在App的不同功能模块中，图片展示的大小也不同。然而，旅游线路上传之初，图片只存在一种适用于网站的尺寸，所以这就导致以下问题：
1，图片过大导致 APP加载图片速度慢；
2，消耗用户过多流量；
等等。所以，针对服务器图片处理的解决方案迫在眉睫。
Nginx中的image_filter_module为上述场景提供了可行的方法，本文就此作详细的介绍

一，思路：
1，app请求图片，并提供图片的尺寸信息，nginx拦截请求后，处理并缓存图片；
2，当app下次请求同样的图片时，nginx直接取缓存中的图片返回给app。

二，Nginx图片处理流程图



三，Nginx image_filter_module 配置部署说明：

nginx_http_image_filter_module在nginx 0.7.54以后才出现的，用于对JPEG, GIF和PNG图片进行转换处理
这个模块默认不被编译，所以要在编译nginx源码的时候，加入相关配置信息

－－－－－－－－－－－编译与安装－－－－－－－
下载nginx最新版本
$ curl http://nginx.org/download/nginx-1.8.0.tar.gz |tar
-xzf -
添加nginx 配置信息
$ ./configure —-user=web —-group=web —prefix=/home/web/nginx--with-http_stub_status_module
--without-http-cache --with-http_ssl_module --with-http_image_filter_module
make！
$ make && make install

开启nginx 服务
$ /home/web/nginx/sbin/nginx

以上四步下载最新的nginx源码，并解压到相应文件夹，然后进入该文件夹，
用./configure添加配置信息（配置中设定这个nginx的用户是web，安装目录是/home/web/nginx），用make编译源码。最后开启nginx服务，如果没出错的话，打开浏览器，输入http://ip 可以看到如下信息



———————————配置－－－－－－－－－－－－－
对nginx功能最基本的定义，都来自于/home/web/nginx/conf/nginx.conf这个文件
我们这里在nginx.conf 包含了 “site_enabled/“这个文件夹，并在site_enabled下创建default文件，用于配置服务器的功能，下面直接贴重要配置信息，并赋予注释

# 匹配满足 下面正则表达式的URI。若匹配，进入该功能段 location ~* "^(/static/upload/images)/([\d-]+)/(.*)\.(jpe?g|png)_(\d+)x(\d+)$"{ # 提取正则表达式中的参数，赋给有意义的变量 set $dir $2; #以日期命名的文件夹 set $width $5; #图片的宽 set $height $6; #图片的高 set $dimens "_$5x$6”; #图片纬度信息 set $reImage_name "$3$dimens.$4”; #给图片重命名 xxx_w*h.jpg set $image_name "$3.$4”; ＃图片原始名称 # 重定义图片URI，因为图片的存放位置与访问URI不一致，历史问题 alias /data/nginx/resize_images/$dir/$reImage_name; # 定义image_uri set $image_uri image_resize/$dir/$image_name?width=$width&height=$height; # 判断访问的图片是否存在 # 若不存在，proxy_pass到 location /image_resize 进行图片处理 if (!-f $request_filename) { proxy_pass http://127.0.0.1:82/$image_uri; break; } # 若执行了 proxy_pass，则下面四句都是为了保存处理后的图片，以备日后的访问 proxy_store /data/nginx/resize_images/$dir/$reImage_name; proxy_store_access user:rw group:rw all:r; proxy_temp_path /data/images; proxy_set_header Host $host; #访问日志路径 access_log logs/store.access.log; } # 匹配满足 /image_resize的URI，都是来自上面的location location /image_resize { #access_log logs/image_resize.log; #重定义 访问URI alias /data/alidata4/files_opt/static/upload/images/; # 根据参数，resize 找到的图片 image_filter resize $arg_width $arg_height; image_filter_jpeg_quality 75; # 禁止外网的访问，只允许本地访问 allow 127.0.0.0/8; deny all; }

参考：
1，从源码编译 nginx
2，nginx配置入门介绍
3，如何控制nginx
4，nginx如何处理http请求
5，nginx的proxy_module（代理模块）
6，nginx的image_filter_module