nginx图片处理笔记，http-image-filter-module、lua
实验环境：CentOS 6.10
目标：1.使用http-image-filter-module进行图片变换；2.使用lua进行格式转换；
安装EPEL
https://fedoraproject.org/wiki/EPEL
yum install https://dl.fedoraproject.org/pub/epel/epel-release-latest-6.noarch.rpm # or RHEL/CentOS 7 # yum install https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm由于lua-nginx-module声称（2018-12-06）测试的最新nginx稳定版本是1.12.x(参考：https://github.com/openresty/lua-nginx-module#nginx-compatibility），所以选择安装nginx版本为1.13.6
curl -O http://nginx.org/download/nginx-1.12.2.tar.gz yum install -y gcc g++ gcc-c++ zlib zlib-devel openssl openssl-devel pcre pcre-devel yum install -y nginx-1.12.2 yum install -y libjpeg-turbo-devel libpng-devel freetype-devel libtiff-devel libXpm-devel libwebp-devel fontconfig-devellibimagequant && libgd && add http-image-filter-module
https://github.com/libgd/libgd
https://github.com/ImageOptim/libimagequant
cd libimagequant-2.12.2 ./configure --prefix=/usr make libimagequant.so make install > install -d /usr/lib > install -d /usr/lib/pkgconfig > install -d /usr/include > install -m 644 libimagequant.a /usr/lib/libimagequant.a > install -m 644 libimagequant.so.0 /usr/lib/libimagequant.so.0 > ln -sf libimagequant.so.0 /usr/lib/libimagequant.so > install -m 644 imagequant.pc /usr/lib/pkgconfig/imagequant.pc > install -m 644 libimagequant.h /usr/include/libimagequant.h # cd ../libgd-2.2.5 ./configure --with-liq=/opt/src/libimagequant-2.12.2 make make install gdlib-config --all > gdlib-config: warning: this script is deprecated; please use the pkg-config file instead. > GD library 2.2.5 > includedir: /usr/local/include > cflags: -I/usr/local/include > ldflags: > libs: -lm -lz -lpng12 -lfreetype -lfontconfig -ljpeg -limagequant -fopenmp > -lXpm -lX11 -ltiff -lwebp > libdir: /usr/local/lib > features: GD_GIF GD_GIFANIM GD_OPENPOLYGON GD_ZLIB GD_PNG GD_FREETYPE GD_FONTCONFIG GD_JPEG GD_LIQ GD_XPM GD_TIFF GD_WEBP ln -s /usr/local/lib/libgd.so.3.0.5 /usr/lib64/libgd.so ln -s /usr/local/lib/libgd.so.3.0.5 /usr/lib64/libgd.so.3 ln -s /usr/lib/libimagequant.so.0 /usr/lib64/libimagequant.so.0 # cd nginx-1.12.2 # 已经安装 yum install -y nginx-1.12.2，所以通过nginx -V获取原编译参数，再加上--with-http_image_filter_module重新编译 nginx -V ./configure --prefix=/etc/nginx --sbin-path=/usr/sbin/nginx --modules-path=/usr/lib64/nginx/modules --conf-path=/etc/nginx/nginx.conf --error-log-path=/var/log/nginx/error.log --http-log-path=/var/log/nginx/access.log --pid-path=/var/run/nginx.pid --lock-path=/var/run/nginx.lock --http-client-body-temp-path=/var/cache/nginx/client_temp --http-proxy-temp-path=/var/cache/nginx/proxy_temp --http-fastcgi-temp-path=/var/cache/nginx/fastcgi_temp --http-uwsgi-temp-path=/var/cache/nginx/uwsgi_temp --http-scgi-temp-path=/var/cache/nginx/scgi_temp --user=nginx --group=nginx --with-compat --with-file-aio --with-threads --with-http_addition_module --with-http_auth_request_module --with-http_dav_module --with-http_flv_module --with-http_gunzip_module --with-http_gzip_static_module --with-http_mp4_module --with-http_random_index_module --with-http_realip_module --with-http_secure_link_module --with-http_slice_module --with-http_ssl_module --with-http_stub_status_module --with-http_sub_module --with-http_v2_module --with-mail --with-mail_ssl_module --with-stream --with-stream_realip_module --with-stream_ssl_module --with-stream_ssl_preread_module --with-cc-opt='-O2 -g -pipe -Wall -Wp,-D_FORTIFY_SOURCE=2 -fexceptions -fstack-protector --param=ssp-buffer-size=4 -m64 -mtune=generic -fPIC' --with-ld-opt='-Wl,-z,relro -Wl,-z,now -pie' --with-http_image_filter_module > ... > checking for GD library ... found > checking for GD WebP support ... found > ... make cd objs cp /usr/sbin/nginx /usr/sbin/nginx.old.20181206 /cp nginx /usr/sbin/nginx -f nginx -V测试nginx
location ~* ^/img/.*_(\d+)x(\d+)\.(jpg|JPG|gif|GIF|png|PNG)$ { set $img_width $1; set $img_height $2; rewrite ^(.*)_(\d+)x(\d+)\.(jpg|JPG|gif|GIF|png|PNG)$ $1.$4 break; image_filter resize $img_width $img_height; image_filter_buffer 10M; }测试image_filter是否支持webp
yum install -y libwebp-tools cwebp xxx.jpg -o xxx.webp curl -I http://192.168.1.10/img/288822bcfbcbdea89eaa9b84cc42f562_500x500.webp测试image_filter + proxy_pass
location ~* ^/oss/(.*)_(\d+)x(\d+)\.(jpg|JPG|jpeg|JPEG|gif|GIF|png|PNG|webp|WEBP)$ { set $img_width $2; set $img_height $3; image_filter resize $img_width $img_height; image_filter_buffer 10M; resolver 114.114.114.114; proxy_pass http://image-demo.oss-cn-hangzhou.aliyuncs.com/$1.$4; # 借用oss的示例图片 https://help.aliyun.com/document_detail/44688.html }LUAJIT
# http://luajit.org/download.html curl -O http://luajit.org/download/LuaJIT-2.0.5.tar.gz tar -zxvf LuaJIT-2.0.5.tar.gz cd LuaJIT-2.0.5 make PREFIX=/usr/local/luajit make install PREFIX=/usr/local/luajit vi /etc/profile >> export LUAJIT_LIB=/usr/local/luajit/lib >> export LUAJIT_INC=/usr/local/luajit/include/luajit-2.0 source /etc/profilengx_devel_kit (NDK) && lua-nginx-module
# https://github.com/openresty/lua-nginx-module/releases tar -zxvf lua-nginx-module-0.10.13.tar.gz # https://github.com/simpl/ngx_devel_kit/releases tar -zxvf ngx_devel_kit-0.3.0.tar.gz编译安装nginx
./configure --prefix ...省略... --with-http_image_filter_module --add-module=/opt/src/ngx_devel_kit-0.3.0 --add-module=/opt/src/lua-nginx-module-0.10.13 make cd objs cp /usr/sbin/nginx /usr/sbin/nginx.old.20181215 /bin/cp nginx /usr/sbin/nginx -f ln -s /usr/local/luajit/lib/libluajit-5.1.so.2.0.5 /usr/lib64/libluajit-5.1.so.2 service nginx restart # 验证Nginx是否链接了libluajit-5.1.so.2 ldd /usr/sbin/nginx | grep luahello,lua
location /lua_hello { default_type 'text/plain'; content_by_lua 'ngx.say('hello,lua!')'; } location /lua_hello2 { default_type 'text/plain'; content_by_lua_block { ngx.say("hello,world!"); ngx.log(ngx.ERR, "hello"); } }用lua来做代理
location ~* ^/lua_capture/(.*)_(\d+)x(\d+)\.(jpg|JPG|jpeg|JPEG|gif|GIF|png|PNG|webp|WEBP)$ { default_type 'text/plain'; content_by_lua_block { local proxy_url = "/proxy/" .. ngx.var[1] .. "." .. ngx.var[4] ngx.log(ngx.ERR, proxy_url) local resp = ngx.location.capture(proxy_url, { method = ngx.HTTP_GET, args = {q="hello"} }) if not resp then ngx.say("request error:", err); return end ngx.log(ngx.ERR, tostring(resp.status)) ngx.status = resp.status for k, v in pairs(resp.header) do if k ~= "Transfer-Encoding" and k ~= "Connection" then ngx.header[k] = v end end if resp.body then ngx.say(resp.body) end } } location ~ ^/proxy/(.*)$ { # internal; resolver 114.114.114.114; proxy_pass http://image-demo.oss-cn-hangzhou.aliyuncs.com/$1; }todo: 如何实现实时转webp呢？
参考：
- 上一篇 »CSS中filter滤镜学习笔记
- 下一篇 »PHP：GD库 图片水印处理