Plupload. Фильтр для ширины и высоты картинки

Написана 5 Сентября, 2013 в 13:04. Автор: borN_free   |   Теги: plupload, image, constraint Комментарии 1

Plupload

К сожалению, Plupload не имеет встроенного фильтра для проверки ширины и высоты изображения. Немного погуглив, наиболее адекватные решение (хотя и не работающий после копирования) здесь:


Приведу наконец-таки рабочий код. Для того, чтобы добавить такой фильтр, необходимо кастомизировать событие FilesAdded:

uploader.bind('FilesAdded', function(up, filesParam) {
    if (uploader.runtime == "html5") {
        var files = jQuery("#" + uploader.id + "_html5").get(0).files;

        jQuery.each(files, function(i, file) {
            var reader = new FileReader();

            reader.onload = (function(e) {
                var image = new Image();
                image.src = e.target.result;

                image.onload = function() {
                    // тут важно использовать именно natural*
                    if (this.naturalWidth <= 500 && this.naturalHeight <= 500) {
                        up.start(); // если все ок - загружаем файл
                    } else {
                        // если размеры недопустимы - удаляем файл из очереди
                        uploader.removeFile(filesParam[i]);
                        // и выкидываем ошибку

                        uploader.trigger('Error', {
                            code : 2,
                            message : "сообщение ваше об ошибке размера",
                            details : '',
                            file : file
                        });
                    }
                }

                image.onerror = function() {
                    uploader.trigger('Error', {
                        code : 1,
                        message : "сообщение ваше об ошибке типа файла",
                        details : '',
                        file : file
                    });
                }
            });

            reader.readAsDataURL(file);
        });
    } else {
        // например для IE9 html5 работать отказывается, придется валидировать на сервере
        setTimeout(function () { up.start(); }, 100);
    }
});

Необходима ли серверная валидация? Конечно, обязательно. Приведу укороченный класс Uploader из Symfony проекта. (к сожалению в связи с некоторой архитектурой и использованием SonataMediaBundle использовать встроенные в Symfony ImageConstraint не удалось)

use Imagine\Exception\RuntimeException;

// ...


private function uploadUserLogo(UploadedFile $file)
{
    list($width, $height) = getimagesize($file->getRealPath());

    if (null === $width || null === $height) {
        throw new RuntimeException('Ваше сообщение, что загружаемый файл не картинка');
    }

    if ($width > Media::LOGO_MAX_WIDTH || $height > Media::LOGO_MAX_HEIGTH) {
        throw new RuntimeException('Ваше сообщение о неправильные размерах'));
    }
    
    // далее все ок, аплодим и сохраняем, используя SonataMediaBundle

    $media = new Media();
    $media->setName($file->getClientOriginalName());
    $media->setBinaryContent($file->getRealPath());
    $media->setContext('user');
    $media->setProviderName('sonata.media.provider.image');
    $media->setEnabled(true);
    $media->setOrder(0);

    /** @var \Sonata\MediaBundle\Document\MediaManager $mediaManager */
    $mediaManager = $this->container->get('sonata.media.manager.media');
    $mediaManager->save($media);

    // get url of new created media
    $mediaService = $this->container->get('sonata.media.pool');
    $provider = $mediaService->getProvider($media->getProviderName());
    $format = $provider->getFormatName($media, 'small');
    $url = $provider->generatePublicUrl($media, $format);

    return ['jsonrpc' => '2.0', 'result' => true, 'id' => $media->getId(), 'url' => $url];
}

Plupload. how to restrict image size by width and height.

One comment

ответить
August 15, 2017 at 03:34 am

The Rolex's top Observatory chronometer, which has been cheap watch tested only after the movement has been put into the perpetual watches watch case, has an average error of less than two seconds per day, more than two times more accurate than the omega uk average chronometer certified chronometer.

Оставьте свой комментарий:

Поля с * обязательны.