使用CakePHP 2上传插件后创建缩略图

Question

I am using the CakePHP Upload plugin since quite some time and I am really happy with it:

public $actsAs = array(
    'Upload.Upload' => array(
        'image' => array(
            'fields' => array(
                'dir' => 'dir'
            ),
            'thumbnailSizes' => array(
                'xvga' => '1024x768',
                'vga' => '640x480',
                'thumb' => '300x300'
            ),
            'thumbnailMethod'  => 'php',
        )
    )
);

In a new usecase I have to make some better thumbnails than some static downgrade of the resolution to 640x640 or 300x300. I want to have a resolution per image orientation or the ability to say that an image should not exceed 30kB.

Jose Gonzales, the plugin author, makes it clear that the Upload plugin does not create thumbnails:

This plugin does not create thumbnails. You can use a custom Transformer to create modified versions of file uploads.

I'd like to know how this could be achieved together with the existing Upload plugin?

Answer 1

In the end I was using glide from thephpleague: https://github.com/thephpleague/glide

As described on the documents page, it allows for "on-the-fly" image manipulation such as:

• Adjust, resize and add effects to images using a simple HTTP based API.
• Manipulated images are automatically cached and served with far-future expires headers.
• Change orientation
• Add watermarks
• Add filters
• Add borders
• Define max size of image

The implementation is as simple as this in CakePHP (no plugin needed). Add the library as dependency in your composer.json:

"require": {
    "league/glide" : "1.0.x"
},

run ./composer.phar update

In the controller action it can be called like this:

public function imageResize() {
    $server = League\Glide\ServerFactory::create([
        'source' => 'files',
        'cache' => 'files/cache',
        'watermarks' => 'files/watermarks'
    ]);

    $server->outputImage($path, $_GET);
}

So I can simply call the image from the app like this:

https://www.url.com/images/imageResize?w=480&mark=mark.png&markpos=right&markh=60&markpad=4

---

Another useful library is Adaptive Images: http://adaptive-images.com

It detects your visitor's screen size and automatically creates, caches, and delivers device appropriate re-scaled versions of your web page's embeded HTML images. No mark-up changes needed. It is intended for use with Responsive Designs and to be combined with Fluid Image techniques.