Nginx-Lua 将 Jpg/png 转 Webp

WebP格式，谷歌（google）开发的一种旨在加快图片加载速度的图片格式。图片压缩体积大约只有JPEG的2/3，并能节省大量的服务器带宽资源和数据空间。Facebook Ebay等知名网站已经开始测试并使用WebP格式。需要 Chrome支持 。

目标：在访问 xxx.png/jpg.webp 时 ，自动从 xxx.png/jpg 生成 对应webp 图片，并且返回给请求，要求高速，Nginx-lua 可以将这一需求截断在 网络请求，并且 Lua 执行速度快。

Nginx配置

location ~ /img/article/(\d)+/ { # 按照自己的规则定义正则匹配
        expires 30d; # 设置资源缓存30天
        try_files $uri $uri/ @webp; # 如果文件不存在尝试生成 webp 图片
  }

  location @webp{
        if ($uri ~ "/([a-zA-Z0-9-_]+)\.(png|jpg|gif)\.webp") {
                content_by_lua_file "/usr/local/openresty/nginx/lua/webp.lua"; # 设置lua脚本path
        }
  }

Lua 脚本

function file_exists(name)
   local f=io.open(name,"r")
   if f~=nil then io.close(f) return true else return false end
end

local newFile = ngx.var.request_filename;
local originalFile = newFile:sub(1, #newFile - 5);
if not file_exists(originalFile) then
  ngx.exit(404);
  return;
end
 -- cwebp -q 50 2.png -o 2.webp
executeCmd = "cwebp -q 80 " .. originalFile  .. " -o " .. newFile
os.execute(executeCmd);

if file_exists(newFile) then
    ngx.exec(ngx.var.uri)
else
   --调试代码 start
   file = io.open ("/usr/local/openresty/nginx/logs/file.log" ,"a")
   file:write("\n")
   file:write(executeCmd)
   file:write("\n")
   file:write(originalFile)
   file:write("\n")
   file:write(newFile)
   file:write("\n")
   file:close()
   --调试代码 end
   ngx.exit(404)
end

图片效果和质量对比

效果：

大小：