SkillAgentSearch skills...

EvaThumber

A light-weight url based image transformation php library

GenerateConvertImprove

Install / Use

/learn @AlloVince/EvaThumber
About this skill

Quality Score

0/100

Supported Platforms

Universal

README

EvaThumber : 基于URL的图片处理库 (可实现缩略图 | 二维码 | 水印 | 面部识别等,基于PHP

EvaThumber 是一个基于URL的轻量级图片处理库，支持缩放/旋转/截取/滤镜等多种常用图片处理，支持设置水印/二维码，并且可以进行面部识别以及PNG优化压缩，所有处理仅仅需要通过更改图片的URL。

EvaThumber基于PHP实现，可以一键安装在任何主流系统，由于基于URL实现接口，所以其他编程语言也可以使用EvaThumber作为前端组件。

EvaThumber is a url based image transformation php library. See English version document.

EvaThumber的源代码存放于Github，完全开源，欢迎Fork或关注我。

下面是几个实例：

原图：

http://evathumber.avnpc.com/upload/demo.jpg

EvaThumber Image Demo

EvaThumber的处理：裁剪为宽100，高100，加黑白滤镜，输出为png格式

http://evathumber.avnpc.com/thumb/d/demo,c_fill,f_gray,h_100,w_100.png

EvaThumber Image Demo

按宽度缩小到150px，旋转180度，加上水印，压缩质量为60%。

http://evathumber.avnpc.com/thumb/watermark/demo,q_60,r_180,w_150.jpg

![EvaThumber Image Demo](http://evathumber.avnpc.com/thumb/watermark/demo,q_60,r_180,w_150.jpg)

使用二维码作为水印，水印放在图片中央，缩小到原图的50%

http://evathumber.avnpc.com/thumb/watermark2/demo,p_50.jpg


![EvaThumber Image Demo](http://evathumber.avnpc.com/thumb/watermark2/demo,p_50.jpg)

在项目初期原型设计时，想要做一个图片墙功能，一般需要一些高质量的图片作为素材先看看效果，还在为一张一张找然后一张一张裁剪而感到厌烦？

EvaThumber只需要直接书写HTML，高素质的图片会自动下载并剪裁为指定尺寸展示出来：

``` html
<div style="max-width:800px;" class="thumbnails">
<div class="span4"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/01,c_fill,d_flickr,h_270,w_360.jpg"></a></div>
<div class="span3"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/02,c_fill,d_picasa,h_128,w_260.jpg"></a></div>
<div class="span2"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/03,c_fill,d_picasa,h_128,w_160.jpg"></a></div>
<div class="span3"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/04,c_fill,d_picasa,h_128,w_260.jpg"></a></div>
<div class="span2"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/05,c_fill,d_picasa,h_128,w_160.jpg"></a></div>
</div>
<div style="max-width:800px;" class="thumbnails"> <div class="span4"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/01,c_fill,d_flickr,h_270,w_360.jpg" alt=""></a></div> <div class="span3"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/02,c_fill,d_picasa,h_128,w_260.jpg" alt=""></a></div> <div class="span2"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/03,c_fill,d_picasa,h_128,w_160.jpg" alt=""></a></div> <div class="span3"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/04,c_fill,d_picasa,h_128,w_260.jpg" alt=""></a></div> <div class="span2"><a class="thumbnail" href="#"><img src="http://evathumber.avnpc.com/thumb/d/05,c_fill,d_picasa,h_128,w_160.jpg" alt=""></a></div> </div>

为什么用EvaThumber

  • 一切基于URL，人人可用，任何项目均可集成
  • 所见即所得，前端人员无痛调试
  • 设计人员在项目前期大量图片素材自动获取
  • 同时支持GD/Imagick/Gmagick三大主流图片处理库，几乎可在所有服务器上部署
  • 面部识别/水印/PNG优化压缩等更多有趣功能

基本功能 (URL API)

URL基本构成

一个典型的EvaThumber的URL形如：

http://evathumber.avnpc.com/<span class="label label-info">thumb</span>/<span class="label label-success">default</span>/<span class="label">abc/demo</span><span class="label label-important">,c_fill,w_100,h_100</span><span class="label label-inverse">.gif</span>

高亮的部分分别是：

  • <span class="label label-info">前缀 prefix</span> 可在配置文件中设置，一般是缓存存放的文件夹名
  • <span class="label label-success">配置文件名 configKey</span> 因为一个EvaThumber可以对应多组配置文件，这里用来区分当前正在使用哪一组配置。
  • <span class="label">图片路径</span> 根据图片路径才能找到源文件，如果是压缩包内文件也需要完整的路径
  • <span class="label label-important">操作参数</span> 多个参数以逗号分隔，参数内以下划线区别参数名和值
  • <span class="label label-inverse">输出格式</span> 更改文件扩展名即可更改图片输出格式

举例说明，我们的配置文件为：

'thumbers' => array(
    'default' => array(
        'source_path' => '/usr/www/upload',
        'prefix' => 'thumb',
    ),
    'another' => array(
        'source_path' => '/usr/www/another',
    ),
),

此时访问

http://evathumber.avnpc.com/thumb/default/abc/demo,c_fill,w_100,h_100.gif

首先会找到配置文件的default片段，然后在/usr/www/upload/abc下查找文件名为demo的图片文件。

同理

http://evathumber.avnpc.com/thumb/another/foo.png

会搜索/usr/www/another下的foo.*文件

影子模式

很多时候我们不希望暴露原图片的地址，此时可以通过EvaThumber自动生成原图片的影子图片，保护原图片URL不被泄露，比如

假如原图片位于多级的树形目录下，影子图片也会保持与原图片同样的目录结构，从原切换到影子只需要更改域名或者根目录。

图片尺寸限制

如果图片由用户上传，那么可能会遇到非常大的图片，此时可以在配置文件中设置最大尺寸限制。比如

'thumbers' => array(
    'max' => array(
        'max_width' => 100,
        'max_height' => 100,
    ),
）,

访问当前配置下的图片，图片宽度已经被限制为100：

http://evathumber.avnpc.com/thumb/max/demo.jpg

EvaThumber Image Demo

图片格式转换

EvaThumber支持的图片格式有：

支持在任意两种格式间转换，只需要更改URL最后的扩展名即可，比如

http://evathumber.avnpc.com/thumb/d/demo,w_100.gif
http://evathumber.avnpc.com/thumb/d/demo,w_100.xbm

EvaThumber Image Demo

图片缩放

根据宽度缩放 w_[int Width]:

w_允许输入一个整数，控制图片按宽度缩放，下面的URL会生成一张100px宽的图片：

http://evathumber.avnpc.com/thumb/d/demo,w_100.jpg

EvaThumber Resized Image

根据高度缩放 h_[int Height]:

同理h_允许输入一个整数，控制图片按高度缩放，下面的URL会生成一张50px高的图片：

http://evathumber.avnpc.com/thumb/d/demo,h_50.jpg

EvaThumber Resized Image

按百分比缩放 p_[int Percent]:

p_允许输入一个1-100的数字，图片会按照百分比缩放，比如p_30会将图片缩放至原尺寸的30%：

http://evathumber.avnpc.com/thumb/d/demo,p_30.jpg

EvaThumber Resized Image

允许拉伸：

在缩放图片时，如果缩放尺寸大于图片本身的尺寸，操作默认会被忽略，但是也可以在配置文件中强制开启

'thumbers' => array(
    'stretch' => array(
        'allow_stretch' => true,
    ),
）,

此时图片允许被强制拉伸。

http://evathumber.avnpc.com/thumb/stretch/demo,w_310.jpg

图片剪裁

基本正方形剪裁 c_[int Crop]:

c_ 允许输入一个整数，如c_50会从图片的中心位置截取出一张50px*50px的缩略图。

http://evathumber.avnpc.com/thumb/d/demo,c_50.jpg

EvaThumber Resized Image

指定尺寸的剪裁 c_[int Crop] + g_[int Gracity]:

配合c_输入g_，代表指定剪裁的宽度与高度，比如c_50,g_30，代表从图片中心位置剪裁一张50px*30px的缩略图。

http://evathumber.avnpc.com/thumb/d/demo,c_50,g_30.jpg

EvaThumber Resized Image

指定坐标 x_[int X] + y_[int y]:

如果想要指定剪裁的精确位置，需要用x_和y_参数指定起点坐标，x_0,y_0 以图片左上角为坐标原点。

比如 c_50,g_60,x_40,y_30 代表以距离图片左边40px，上边30px为起点，剪裁一张50px*60px的图片。

http://EvaThumber.avnpc.com/thumb/demo,c_100,g_200,x_80,y_10.jpg

EvaThumber Resized Image

图片的剪裁与缩放可以混用，EvaThumber始终会先进行剪裁，然后再对剪裁后的图片缩放。

http://evathumber.avnpc.com/thumb/d/demo,c_50,g_60,x_40,y_30,w_30.jpg

EvaThumber Resized Image

填充模式 c_fill + w_[int Width] + h_[int Height]

在实际使用中，我们经常会遇到这样的场景：需要截取并缩放图片以适应网页布局，此时我们可以使用剪裁中的填充模式，在填充模式下，需要指定剪裁参数为c_fill，同时设定填充的宽度与高度，然后可以得到一张完全吻合设定尺寸，同时经过缩放与剪裁处理的图片。

http://evathumber.avnpc.com/thumb/d/demo,c_fill,w_50,h_50.jpg

EvaThumber Resized Image

<!-- 在填充模式下还可以用`g_`设定剪裁范围，允许的剪裁范围包括`g_top`（从上方）, `g_bottom`（从下方）, `g_left`（从左）， `g_right`（从右）。 http://evathumber.avnpc.com/thumb/d/demo,c_fill,g_left,h_50,w_50.jpg ![EvaThumber Resized Image](http://evathumber.avnpc.com/thumb/d/demo,c_fill,g_left,h_50,w_50.jpg) -->

图片旋转 r_[int Rotate]

r_ 允许指定一个1-360的数字作为图片旋转的角度，比如r_90让图片按照顺时针旋转90度：

http://evathumber.avnpc.com/thumb/d/demo,r_90,w_50.png

EvaThumber Resized Image

图片滤镜 f_[string Filter]

目前支持的滤镜有：

  • f_gray 黑白滤镜

图片压缩质量 q_[int Quality]

q_ 允许指定一个1-100的参数设置jpg图片的压缩质量:

http://evathumber.avnpc.com/thumb/d/demo,w_100,q_10.jpg

EvaThumber Resized Image

也可以在配置文件中设置一个全局压缩质量：

'thumbers' => array(
    'd' => array(
        'quality' => 70,
    ),
),

水印

图片水印

可以在配置文件中指定layer_file为一张图片作为水印：

'thumbers' => array(
    'd' => array(
        'watermark' => array(
            'enable' => 1,
            'position' => 'br',
            'layer_file' => __DIR__ . '/layers/watermark.png',
        ),
    ),
),

水印的位置可以在：

  • tl : Top Left 左上
  • tr : Top Right 右上
  • bl : Bottom Left 左下
  • br : Bottom Right 右下
  • center : 中央

EvaThumber Resized Image

文字水印

同样可以直接使用文字作为水印

'thumbers' => array(
    'd' => array(
        'watermark' => array(
            'enable' => 1,
            'position' => 'br',
            'layer_file' => '',
            'text' => 'EvaThumber',
            'font_file' => __DIR__ . '/layers/Yahei_Mono.ttf',
            'font_size' => 12,
            'font_color' => '#FFFFFF',
        ),
    ),
),

此时必须将layer_file指定为空，同时设置：

  • font_file : 水印使用的ttf字体文件
  • font_size : 字体大小
  • font_color : 字体颜色
  • text : 文字内容

![EvaThumber R

AlloVince

View profile

View on GitHub
GitHub Stars548
CategoryDevelopment
Updated1mo ago
Forks179
AlloVince/EvaThumber

Languages

PHP

Security Score

95/100

Audited on Feb 25, 2026

No findings