使用Tengine+Lua+GraphicsMagick实现图片自动裁剪缩放
随着互联网的快速发展、需求频繁变更、内容数量的俱增、时间的持续增长，图片数量也会越来越多。在实际需求中，会出现在若干个页面或同一个页面不同位置，展示同一条信息以及其缩略图。此时若使用CSS 控制图片显示的大小，对于一些与该位置不成比例的图片，缩小后就会出现图片变形，并且也不可能让 UI 对所有的图片进行 PS，特别是当一张图需要多种比例尺寸，这样会产生巨大的工作量。基于这种情况就产生了强烈的自动化裁剪、缩放图片的需求，来适应不同规格的缩略图。那么针对作为一个旅游电商类网站：爱旅行项目，页面中有大量的图片加载，图片也是非常重要的一项页面内容，并且随之移动端的加入，考虑页面的响应速度，图片的加载速度，以及节省用户流量等等系统性能方面，都需要页面初始加载不再使用原图，而是根据不同比例需求等比缩放的小图。所以要实现该非功能性需
求，我们的解决方案是使用 Tengine+Lua+GraphicsMagick 来实现图片自动裁剪缩放。 补充说明：Nginx 虽然有自带的image filter module 也可实现此功能，但是存有弊端，所以我们不推荐。
1> image filter module 使用的是 GD，但是 GD 性能、效率以及处理后的图片质量都不
如 GraphicsMagick
2> image filter module 没法真正生成裁剪/缩放后的图片，而是通过 Nginx 直接输出的，
这样每次请求或缓存过期后都需要重新裁剪/缩放，这样无疑会增加Nginx 负担。
1.1软件准备
1. Tengine
1>淘宝的 Nginx，集成了lua 模块，若要是使用官方的 Nginx，默认安装没有 lua 模块，自己安装配置较为麻烦，所以我们选择 Tengine。Tengine 主要负责展示图片和调度 Lua 脚本
2>安装包：tengine-master.zip
3>下载地址：https://github.com/alibaba/tengine
2. Lua
1>脚本语言，可以方便的嵌入到应用程序中，提供灵活的扩展和定制功能。具体运用主要是嵌入到Tengine 中，方便 Tengine 通过 Lua 实现对 GM 操作，并通过 Lua脚本控制裁剪、缩放规格。
2>安装包：lua-5.3.1.tar.gz、LuaJIT-2.0.4.tar.gz（Lua 依赖包）
3>下载地址：http://www.lua.org/ftp/
http://luajit.org/download.html
3. GraphicsMagick
1>强大的图片处理工具，没有 UI 的 PS，动态的生成图片，特别适用于互联网的应用。GM 负责对图片的处理（裁剪、等比缩放、增加特效等等）
2>安装包：GraphicsMagick-1.3.18.tar.gz
3>下载地址：https://sourceforge.net/projects/graphicsmagick/files/graphicsmagick/
4. 依赖包和类库，可 yum 安装
1>libjpeg、libjpeg-devel
2>libpng、libpng-devel
3>giflib、giflib-devel
4>freetype、freetype-devel
1.2安装与配置
1.2.1 安装
安装过程不再赘述，安装后的路径：
1>/usr/local/Tengine 2> /usr/local/GraphicsMagick
安装过程强调两点：
1. 安装顺序： 1、GraphicsMagick 2、Lua 3、Tengine
2. 安装 Tengine 时，进入 Tengine 源码目录，使用 configure配置安装路径以及需要安装的模块：
1> ./configure --prefix=/usr/local/Tengine --dso-path=/usr/local/Tengine/modules
--with-http_realip_module--with-http_gzip_static_module --with-http_stub_status_module--with-http_concat_module
--with-http_lua_module --http-proxy-temp-path=/var/tmp/Tengine/proxy_temp
--http-fastcgi-temp-path=/var/tmp/Tengine/fastcgi_temp--http-uwsgi-temp-path=/var/tmp/Tengine/uwsgi_temp
--http-scgi-temp-path=/var/tmp/Tengine/cgi_temp
--http-client-body-temp-path=/var/tmp/Tengine/client_body_temp
--http-log-path=/var/log/Tengine/access.log
--error-log-path=/var/log/Tengine/error.log
2>make&make install
1.2.2 配置
1. 负责处理图片（裁剪、缩放）的 Lua 脚本（/usr/local/Tengine/lua/ImageResizer.lua），注意：ImageResizer.lua文件需要可执行权限 local command = "/usr/local/GraphicsMagick/bin/gm convert" .. ngx.var.request_filepath .. " -resize " .. ngx.var.width .."x" .. ngx.var.height .. " +profile \"*\" " ..ngx.var.request_filepath .. "_" .. ngx.var.width .. "x" ..ngx.var.height .. "." ..
ngx.var.ext; os.execute(command);ngx.exec(ngx.var.request_uri);
2. Nginx 配置user root; # 裁剪、缩放图片需要 root 权限server {
listen 80; server_name img.itrip.project.bdqn.cn;
root /data/itrip/uploadimg; location / {
root /data/itrip/uploadimg; # 站点根目录
expires 1h; # 缓存时间
add_header Cache-Control max-age=3600; # 缓存时间
access_log /var/log/Tengine/host_access.log;
}
#如果 url 格式如：xxxx.gif_数字 x 数字.gif
location ~*^(.+\.(jpg|jpeg|gif|png))_(\d+)x(\d+)\.(jpg|jpeg|gif|png)$ {
root /data1/uploadimg; #这里必须设置，否则根目录，即 $document_root 会是 Nginx 默认的 Nginx Root/html，在 Lua 中会得不到期望的值 if (!-f $request_filename){ #如果文件不存在时才需要裁剪 add_header X-Powered-By'Lua GraphicsMagick'; #此 HTTPHeader 无实际意
义，用于测试
add_header file-path $request_filename; #此 HTTP Header 无实际意义，用于测试
lua_code_cache on; #在编写外部Lua 脚本时，设置为 off Nginx 不会缓存 Lua，方便调试
set $request_filepath /data1/uploadimg$1; #设置原始图片路径，如：
/document_root/1.gif
set $width $3; # 设置裁剪/缩放的宽度
set $height $4; # 设置裁剪/缩放的高度
set $ext $5; # 图片文件格式后缀
content_by_lua_file /usr/local/Tengine/lua/ImageResizer.lua; #加载外部 Lua 文件
}
}
…}
1.3项目运用
在进行爱旅行项目实际业务操作时，就可以实现按需自动等比缩放，系统中的所有的上传图片，都只须上传原始图即可，有效的省去切图的工作量。具体示例如下：
目前服务器上有一张原始图（8-3566787986543-7654678.jpg）：
访 问 该 原 始 图 (8-3566787986543-7654678.jpg) 的 URL 为 ：
http://192.68.9.44/comment/8-3566787986543-7654678.jpg，如图 2 所示：
若根据需求，页面需要展现该图片的小图（300x300），那么前端只需访问：
http://192.168.9.44/comment/8-3566787986543-7654678.jpg_300x300.jpg（如图 3 所示）即可，
即：根据用户的访问请求，Lua 会自动进行图片缩放，生成相应尺寸的小图。
服务器上自动生成 8-3566787986543-7654678.jpg_300x300.jpg，