图片服务器存在的需求是，根据手机屏幕尺寸以及dpi的不同，将一些尺寸较大的图片进行动态等比例缩放，最终达到不浪费屏幕像素、也不希望图片糊掉的目的。
nginx下需要用到的东西：
- http_image_filter模块；
- proxy_pass/proxy_store；
预期的使用方法如下：
- 在服务器/webroot/image_resize文件夹下，建立当前项目文件夹（下文以aaa代替）；
- 在aaa中传入希望动态缩放的图片文件（jpg，png），不要在aaa中传入文件夹；
- 将aaa的权限递归设置为777;
- 在浏览器输入http://hostname/resizeFile/images/aaa/12.jpg_10x10 , 就会在aaa中生成张将原图缩放为10x10的图片。之后每次访问该地址，都将得到这张已经生成好的图片。
下面是nginx图片服务器部分的代码：
location ~ "^(/resizeFile/images)/([\w-]+)/(.*)\.(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";
set $image_name "$3.$4";
alias /webroot/image_resize/$dir/$reImage_name;
set $image_uri image_resize/$dir/$image_name?width=$width&height=$height;
if (-f $request_filename){
}
if (!-f $request_filename) {
# proxy_pass http://127.0.0.1:80/$image_uri;
proxy_pass http://127.0.0.1/image_resize/$dir/$image_name?width=$width&height=$height;
break;
}
proxy_store /var/market/image_resize/$dir/$reImage_name;
proxy_store_access user:rw group:rw all:r;
proxy_temp_path /var/market/tempFIle;
proxy_set_header Host $host;
}
location ^~ /image_resize/{
#access_log logs/image_resize.log;
image_filter resize $arg_width $arg_height;
image_filter_jpeg_quality 75;
}
注意事项:
- 建议将多数图片传入cdn服务器，图片服务器的目的是对大尺寸图片进行缩放，否则会浪费图片服务器的带宽；
- 前端在使用时，建议将原始图片宽高存入img的data属性内，然后根据dpi、屏幕尺寸、页面缩放比例来确定缩放后的宽和高。
