［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

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

猜你喜欢