Работа с изображениями на PHP с использованием GD. Полное руководство по загрузке изображений на PHP Применение оттенков серого и контрастных фильтров для каждого изображения в каталоге

9 years ago

Hello there,
i made a function to create a gradient image.

description:
gradient(int image_width, int image_height,
int start_red, int start_green, int start_blue,
int end_red, int end_green, int end_blue,
bool vertical)

function:
function gradient ($image_width , $image_height , $c1_r , $c1_g , $c1_b , $c2_r , $c2_g , $c2_b , $vertical = false )
{
// first: lets type cast;
$image_width = (integer) $image_width ;
$image_height = (integer) $image_height ;
$c1_r = (integer) $c1_r ;
$c1_g = (integer) $c1_g ;
$c1_b = (integer) $c1_b ;
$c2_r = (integer) $c2_r ;
$c2_g = (integer) $c2_g ;
$c2_b = (integer) $c2_b ;
$vertical = (bool) $vertical ;

// create a image
$image = imagecreatetruecolor ($image_width , $image_height );

// make the gradient
for($i = 0 ; $i < $image_height ; $i ++)
{
$color_r = floor ($i * ($c2_r - $c1_r ) / $image_height )+ $c1_r ;
$color_g = floor ($i * ($c2_g - $c1_g ) / $image_height )+ $c1_g ;
$color_b = floor ($i * ($c2_b - $c1_b ) / $image_height )+ $c1_b ;

$color = ImageColorAllocate ($image , $color_r , $color_g , $color_b );
imageline ($image , 0 , $i , $image_width , $i , $color );
}

# Prints out all the figures and picture and frees memory
header ("Content-type: image/png" );

if($vertical ){ $image = imagerotate ($image , 90 , 0 );}
ImagePNG ($image );
imagedestroy ($image );
}
?>

7 years ago

In case your script is using output-buffering-functions somewhere, then you have to clear the buffer first (with ob_clear()), before outputting an image with a function like imagepng().

And you should make sure that no buffer will get send after outputing an image by using the ob_end_flush()-function.

Furthermore you should check if a buffer has already been flushed somewhere before. This can be done using the headers_sent()-function.

Here is the full solution:

if(headers_sent ()){
die("Headers have been send somewhere within my script" );
}

Ob_clean (); //Clears the buffer

Header ("Content-type: image/png" );
imagepng ($img , NULL , 0 , NULL );

Ob_end_flush (); //Now we send the header and image plus we make sure that nothing will get send from now on (including possible shutdown-functions and __destruct()-methods) till the end of page-execution
?>

10 years ago

You know, maybe this goes without saying, but I thought I would drop a note in here. When developing code to resize images, it is best not to use GD. When using the current GD methodologies, you are reading content from an image and manipulating it. By then writing that content to a brand new file, you are losing the EXIF data.

For purposes when you want to retain EXIF data, it is recommended that you compile in and use the PECL Imagick extension. It has great resizing methods built right in and the EXIF data is retained.

10 years ago

I have been looking to send the output from GD to a text string without proxying via a file or to a browser.

I have come up with a solution.

This code buffers the output between the ob_start() and ob_end() functions into ob_get_contents()

See the example below

// Create a test source image for this example
$im = imagecreatetruecolor (300 , 50 );
$text_color = imagecolorallocate ($im , 233 , 14 , 91 );
imagestring ($im , 1 , 5 , 5 , "A Simple Text String" , $text_color );

// start buffering
ob_start ();
// output jpeg (or any other chosen) format & quality
imagejpeg ($im , NULL , 85 );
// capture output to string
$contents = ob_get_contents ();
// end capture
ob_end_clean ();

// be tidy; free up memory
imagedestroy ($im );

// lastly (for the example) we are writing the string to a file
$fh = fopen ("./temp/img.jpg" , "a+" );
fwrite ($fh , $contents );
fclose ($fh );
?>

Если вы заядлый PHP разработчик, вы, наверняка, не только наслышаны о графической библиотеке GD library. Для тех, кто с ней не знаком, поясняю GD library позволяет создавать изображения, видоизменять и управлять ими без особых усилий. Сегодня, мы познакомимся с азами использования в PHP графической библиотеки GD library.

Прежде всего

Убедитесь, что GD библиотека установлена и активирована на вашем сервере. Не знаете как это сделать? Не переживайте, все просто! Вам только нужно создать PHP файл на сервере, затем введите следующее:

Теперь откройте страницу браузера и вы увидите громадный список возможностей вашей версии PHP. Прокрутите страницу немного вниз, найдите секцию ‘GD’ и убедитесь, что библиотека подключена. Если нет, свяжитесь с компанией, предоставляющей вам услуги хостинга. К счастью, на большинстве серверов, на которых я уже успел поработать и работаю, GD библиотека установлена и подключена.

Основные моменты

Давайте пройдемся по некоторым основным моментам. Во-первых, сделаем так, чтобы все отчеты об ошибках выдавались браузером. Этого можно добиться, введя в самом начале вашего php-кода следующее:

error_reporting(E_ALL);
?>

Нарисуем квадрат

Давайте начнем с самого простого и нарисуем с помощью PHP синий квадрат - ничего сверхъестественного, конечно, но надо же разобраться с основами. Чтобы получить желаемый квадрат, необходимо выполнить следующие действия:

Установить тип содержимого как «изображение», чтобы браузер смог интерпретировать изображение должным образом;
. Создать новое пустое изображение, установив нужную ширину и высоту;
. Сделать цвет фона синим;
. Сохранить окончательный вариант изображения и передать его в браузер;
. Очистить память, которая использовалась для создания и хранения изображения;
. Организовать отображение рисунка из файла index.php

Теперь, когда мы определились с порядком действий, можно начинать кодирование. Я постарался прокомментировать каждую строчку кода, а о функциях, использовавшихся в процессе кодировки, расскажу потом. Итак, вот код для создания нашего синего квадрата. После написания мы сохраним его под именем ‘basic_square.php’.

//Устанавливаем отображение сообщений об ошибках
ini_set ("display_errors", "1");
error_reporting(E_ALL);


//Определяем размеры изображения
//125px width, 125px height
$image = imagecreate(125, 125);

//Выбираем цвет фона
$blue = imagecolorallocate($image, 0, 0, 255);

//Устанавливаем еще один цвет - просто чтобы убедиться, что при отображении рисунка фоновым будет именно цвет, установленный первым ()
//Обратите внимание - квадрат будет синего, а не красного цвета.
$red = imagecolorallocate($image, 255, 0, 0);

//Сохраняем файл в формате png и выводим его
imagepng($image);

//Чистим использованную память
imagedestroy($image);
?>

Теперь давайте рассмотрим все использованные функции и каждый шаг вышеприведенного кода, чтобы лучше понять, что именно мы в нем делаем:

Как я уже пояснял, мы добавляем опцию сообщения об ошибках, чтобы в случае необходимости быстро их исправить
. Затем мы используем функцию header(), чтобы установить тип содержимого - png
. Сохраняем изображение и устанавливаем необходимую ширину и высоту - более подробно см. imagecreate()
. Затем используем функцию imagecolorallocate, чтобы выбрать синий цвет для фона нашего рисунка. Обратите внимание, что в окончательном варианте будет виден цвет, установленный в первую очередь, так что наш квадрат получится синим, а не красным.
. Для окончательного сохранения рисунка мы используем imagepng(). Если вы желаете сохранить рисунок в каком-либо каталоге, следует ввести дополнительные параметры.
. И, наконец, мы чистим память с помощью функции imagedestroy()

Мы можем посмотреть на нарисованный нами квадрат, открыв файл blue_square.php, а, еще лучше будет, если мы установить ссылку на него на главной странице:

Если все было сделано правильно, вы увидите вот такой синий квадрат:

Привет, Мир

Теперь, когда мы научились создавать изображения, давайте попробуем сделать изображение с текстом, написанным выбранным нами шрифтом. Мы можем воспользоваться любым шрифтом из каталога TrueType Font (.tff). В следующих примерах я буду использовать шрифт ‘Advent’. Давайте напишем «Hello World» на темно-сером квадрате. Внимание, смотрим на код, а затем подробно разбираем каждый шаг.

ini_set("display_errors", "1");
error_reporting(E_ALL);


header("content-type: image/png");

//Определяем размер изображения - 300x300 пикселей

//Устанавливаем фоновый темно-серый цвет

//Указываем путь к шрифту
$font_path = "advent_light";

//Пишем текст
$string = "Hello World!";

//Соединяем текст и картинку
imagettftext($image, 50, 0, 10, 160, $white, $font_path, $string);

//Сохраняем изображение
imagepng($image);

//Чистим память
imagedestroy($image);
?>

Сохраним код в файле ‘hello_world.php’и будем открывать его таким же способом, какой был указан выше. Итак, что здесь нового?

Мы установили размер изображения 300*300 пикселей и использовали темно-серый фон
. Обратите внимание, как мы указывали путь к шрифту, используя имя шрифта: дело в том, что далее в коде нам придется накладывать текст на изображение. Кроме того, не забывайте, что имя шрифта пишется без расширения. Впрочем, это зависит от того, какую версию GD-библиотеки использует PHP: если названием шрифта не начинается с ‘/’, то потребуется расширение ttf - то есть, если перед названием файла нашего шрифта не стоит /, то в конце будет автоматически добавлено ttf.
. Затем мы пишем «Hello World!» и сохраняем текст для дальнейшего использования
. Важнейшая функция, использованная в этом коде - это imagettftext(), требующая указания 8 параметров: путь к изображению, размер изображения, угол наклона, ось x, ось y, цвет, шрифт, текст (в таком порядке)

Сохраните код, откройте его любым способом, и вы увидите вот такую картинку:

Поверните его!

Вы заметили, что у функкции imagettftext, соединяющей текст и картинку, есть параметр расположить под углом"? Значит, мы можем повернуть наш текст под любым углом. Давайте перепишем код и повернем строчку на квадрате.

//Устанавливаем сообщения об ошибках
ini_set("display_errors", "1");
error_reporting(E_ALL);

//Устанавливаем тип содержимого
header("content-type: image/png");

//Определяем размер изображения: 300x300 пикселей
$image = imagecreate(300, 300);

//Определяем цвет фона - темно-серый
$dark_grey = imagecolorallocate($image, 102, 102, 102);
$white = imagecolorallocate($image, 255, 255, 255);

//Указываем путь к шрифту
$font_path = "advent_light";

//Пишем текст
$string = "Hello World!";

//Соединяем текст и картинку
imagettftext($image, 50, -45, 30, 70, $white, $font_path, $string);

//Сохраняем изображение
imagepng($image);

//Чистим память
imagedestroy($image);
?>

Обратите внимание, мы установили значение -45 градусов вместо 0 градусов (как в предыдущем примере) - это все, что требуется для того, чтобы повернуть текст. Посмотрите на картинку.

Ну как? Интересно? Нет? Тогда давайте попробуем заняться чем-нибудь более практичным.

Какое сегодня число?

Мы можем не только сами рисовать картинки, но и использовать готовые! Немного кодировки, и у нас получится календарик, отображающий текущую дату (месяц, день и год). Ищем в Google заготовку для календаря, находим изображение в формате.svg - я изменил его размер и перевел в формат png. Посмотрите на заготовку:

Теперь у нас есть основа, и мы можем обработать ее с помощью функций GD и PHP. Предупреждаю, что я не претендую на звание величайшего в мире дизайнера - возможно, на сайте лучше смотрелась бы другая заготовка и другой шрифт. Так что дизайн за вами, а пока давайте посмотрим на код:

//Устанавливаем сообщения об ошибках
ini_set("display_errors", "1");
error_reporting(E_ALL);

//Устанавливаем тип содержимого

//Сохраняем дату
list($month, $day, $year) = explode("/", date("F/jS/Y"));

//Загружаем фоновое изображение
$image = imagecreatefrompng("calendar_blank.png");
$image_width = imagesx($image);

//Определяем цвет фона и шрифт
$white = imagecolorallocate($image, 255, 255, 255);
$black = imagecolorallocate($image, 0, 0, 0);
$font_path = "advent_light";

//Указываем позиции текста
$pos_month = imagettfbbox(13, 0, $font_path, $month);
$pos_day = imagettfbbox(25, 0, $font_path, $day);
$pos_year = imagettfbbox(8, 0, $font_path, $year);

//Пишем месяц
imagettftext($image, 13, 0, ($image_width - $pos_month) / 2, 40, $white, $font_path, $month);

//Пишем день
imagettftext($image, 25, 0, ($image_width - $pos_day) / 2, 80, $black, $font_path, $day);

//Пишем год
imagettftext($image, 8, 0, ($image_width - $pos_year) / 2, 100, $black, $font_path, $year);

//Сохраняем изображение
imagejpeg($image, "", 100);

//Чистим память
imagedestroy($image);
?>

Итак, что мы здесь делаем? Что за функция list()? Давайте разберемся:

Как всегда, мы устанавливаем тип содержимого, чтобы картинка отображалась правильно.
. В 10-й строчке вы видите функцию list function. Мы определяем формат даты с помощью функции explode() и сохраняем его. Таким образом можно упорядочивать любую информацию. Теперь нам открыт доступ к сведениям о текущем месяце, дне и годе.
. В строчках 22-24 мы пользуемся функцией imagettfbbox(), чтобы организовать формат даты. Функция обеспечивает отображение даты в заданном порядке, а для доступа к правому нижнему углу мы пишем $pos_month. Все это нужно для того, чтобы текст автоматически располагался правильно, не зависимо от его размера.
. Затем мы создаем каждую строчку по очереди и устанавливаем размер текста по оси Х.

Если не произошло никаких катастроф, у вас должна получиться представленная ниже картинка, с той лишь разницей, что дата будет той, что установлена на вашем компьютере - мой рисунок, как вы можете догадаться, статичен. За помощь со скриптом спасибо сайту catpin.

Кошки и фильтры изображений

Последнее, чему я сегодня вас научу, это фильтры изображений - очень интересная штука, поверьте мне. Функция imagefilter() берет готовое изображение и определенным образом изменяет его - например, переводит в черно-белый режим. Давайте посмотрим на картинку, с которой мы будем работать, в ее первоначальном виде.

А теперь сделаем кота черно-белым с помощью функции фильтрации изображений.

//Устанавливаем сообщения об ошибках
ini_set("display_errors", "1");
error_reporting(E_ALL);

//проверяем, установлено ли исходное изображение
if(isset($_GET["source"])){
//выполняем базовую обработку рисунка
$image = filter_var($_GET["source"], FILTER_SANITIZE_STRING);

//Загружаем изображение
$image = imagecreatefromjpeg($image);

//Переводим его в черно-белый режим
imagefilter($image, IMG_FILTER_GRAYSCALE);

//Устанавливаем тип содержимого
header("content-type: image/jpeg");

//Сохраняем изображение в качестве 90%
imagejpeg($image, "", 90);

//чистим память
imagedestroy($image);
}
?>

Вышеприведенный скрипт является достаточно гибким, так что вы без труда сможете сделать любой рисунок черно-белым - вот так:

Ставим в «источник» любую картинку, и вскоре она станет черно-белой. Тем, кто планирует использовать эту функцию на общедоступных серверах, потребуются дополнительные меры безопасности. Хотя в вышеприведенном скрипте указано изображение типа.jpeg, вы можете применять функцию для обработки любых графических файлов. Теперь наш кот выглядит так:

Другие фильтры:

В завершение урока я познакомлю вас с некоторыми другими графическими фильтрами и результатами их применения

Фильтр яркости

За яркость изображения отвечает третий параметр:


//третий параметр устанавливает уровень яркости изображения.
imagefilter($image, IMG_FILTER_BRIGHTNESS, 40);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Гауссово размывание

Размывание по Гауссу, никаких дополнительных параметров

header("content-type:image/jpeg");

$image = imagecreatefromjpeg("cat.jpg");
imagefilter($image, IMG_FILTER_GAUSSIAN_BLUR);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Контрастность

Третий параметр определяет контрастность

header("content-type: image/jpeg");
$image = imagecreatefromjpeg("cat.jpg");
imagefilter($image, IMG_FILTER_CONTRAST, -15);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Удаление среднего значения (эффект рисунка)

Никаких дополнительных параметров.

header("content-type: image/jpeg");
$image = imagecreatefromjpeg("cat.jpg");
imagefilter($image, IMG_FILTER_MEAN_REMOVAL);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Цветовой баланс

Устанавливает насыщенность красного, зеленого, синего цветов, а также альфа-канала (по желанию) в перечисленном порядке

header("content-type:image/jpeg");
$image = imagecreatefromjpeg("cat.jpg");
//alpha channel parameter omitted below as it is optional.
imagefilter($image, IMG_FILTER_COLORIZE, 50, 0, 0);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

До новых встреч...

Надеюсь, что вы более или менее разобрались с использованием в PHP библиотеки GD. Во второй части мы рассмотрим некоторые продвинутые техники и, конечно, узнаем еще больше интересного. Используйте библиотеку GD и свои творческие способности и обязательно расскажите мне, что у вас получилось!

В статье описывается работа с расширением PHP - GDLib, которое позволяет динамически формировать изображения на Web-страницах.
Автор - Nykoh (Нико)
Перевод с французского - Антон Федорченко
Адрес оригинала - http://www.phpdebutant.org/article111.php

Для понимания этой статьи необходимо иметь представление об элементарных основах PHP, а также работе с изображениями.

Примечание переводчика

в примерах все названия идентификаторов даны на французском языке. Для того, чтобы облегчить читателю понимание кода, мы предлагаем их перевод:
blanc - белый
bleu - голубой
couleur - цвет
couleur_fond - цвет фона
fichier - файл
gris - серый
hauteur – высота
hauteurimage - высота изображения
largeur – ширина
largeurimage – ширина изображения
mois - месяц
noir - черный
police – гарнитура шрифта
rouge – красный
tableau - массив
vert - зеленый

Примечание переводчика

По умолчанию в PHP 5 все расширения отключены, в том числе и расширение для формирования динамических изображений - GD. За инструкцией по настройки данного расширения, следует обратится к статье

Цели : научить использовать различные функции библиотеки gd, предназначенные для динамического создания изображений.

Библиотека GD представляет собой набор функций для работы с изображениями. Благодаря ей можно не только динамически создавать собственные изображения, но и получать о них различную информацию, изменять размер и т.д.

Внимание : Прежде чем начать работу, нужно кое-что узнать. Дело в том, что существует несколько различных версий этого расширения PHP, а поставщики услуг хостинга могут отключить определенные функции, а то и всю библиотеку GD. С какой целью? Известно, что обработка изображений – это большая нагрузка на сервер.

Итак, вам необходимо узнать версию библиотеки GD установленную на используемом вами хостинге, а также получить информацию о разрешенных функциях. Первое, что следует сделать, - воспользоваться функцией phpinfo. Выполните следующий скрипт:

phpinfo.php

phpinfo ();
?>

Если у вас появится таблица похожая на эту – все нормально (особенно если версия библиотеки новее, чем 2.0)

GD

GD Support

GD Version

FreeType Support

FreeType Linkage

JPG Support

PNG Support

WBMP Support

Как было упомянуто выше, некоторые возможности могут быть отключены. В таком случае следует просто попробовать использовать ту или иную функцию. Если это приведет к ошибке: Fatal error : Call to undefined function, - у вас не должно быть никаких сомнений, что данная функция отключена.

I) Создание холста

Для начала необходимо создать пустой холст. Сразу поясним, что в данной статье мы будем рассказывать исключительно об изображениях в формате PNG или JPG, формат GIF останется без нашего внимания. Дело в том, что этот формат перестал поддерживаться библиотекой GD, начиная с версии 1.3, правда ограниченная поддержка GIF появилась опять в версии 2. Вывод: формат PNG – выгодная альтернатива GIF

Важное замечание

Во всех учебных курсах сайта www.phpdebutant.org, скрипты имели целью динамическое создание html-страниц. На этот раз, используя библиотеку GD, мы создаем изображения, поэтому в данном случае вы должны забыть на время конструкции echo и print. По умолчанию PHP-скрипт генерирует html-страницу, что не требует уточнения в виде отправки особого http-заголовака. Но если мы создаем изображение, в самом начале скрипта необходимо указать его тип, отправкой соответствующего заголовка, например для PNG: header ("Content-type: image/png");

Дальнейшие действия чем-то напоминают работу с графическим редактором. Вы создаете новое изображение, указывая размеры, выбираете цвет фона и сохраняете его в нужном формате. Данную последовательность действий иллюстрирует следующий скрипт:

imagevide.php

header ("Content-type: image/png" );
$im = ImageCreate (200 , 100 )
or die ();
$couleur_fond = ImageColorAllocate ($im , 255 , 0 , 0 );
ImagePng ($im );
?>

Этот небольшой скрипт генерирует красный прямоугольник (очень скромное, но хорошее начало). Описание механизма:

  • Функция ImageCreate возвращает дескриптор $im. Дескриптор $im должен передаваться всем функциям прорисовки изображения. Параметры функции ImageCreate соответствуют длине и ширине создаваемого изображения (200х100).
  • Задача оператора or die – перехват возможных ошибок.
  • Создать цвет можно при помощи функции ImageColorAllocate. Она используется для
    • создания цвета и его сохранение в переменной с целью последующего использования
    • добавление цвета в палитру изображения $im

Ее параметры соответствуют красной, зеленой и синей компонентам цвета и представляют из себя целые числа от 0 до 255. В этом примере мы создали красный цвет.

Важное замечание

этот цвет соответствует цвету фона, поскольку он первым добавляется в палитру изображения

Вызов скрипта imagevide.php (пустое_изображение.php) создаст изображение в формате PNG. Для того, чтобы его использовать на web-сайте, нужно действовать так же, как и в случае с "классическими" изображениями.

Совсем несложно! Вы даже можете передавать параметры скрипту, который будет генерировать изображение (например цвет фона).

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

  • Вы можете заменить ImageCreate на ImageCreateTrueColor, чтобы создать 32 битное изображение (идеально для фотографий)
  • Вы можете заменить ImagePng функцией ImageJPEG чтобы создать изображение в формате JPEG (не забудьте поменять параметр функции header на header("Content-type: image/jpeg").
  • Ниже мы увидим, что сгенерированное изображение можно сохранить

II) Функции прорисовки изображения

Сначала вам необходимо знать, что любой рисунок связан с понятием координат, поэтому в этом небольшом абзаце статьи мы дадим некоторые представления об этом вопросе.
Верхний левый угол изображения имеет координаты (x=0, y=0), а нижний правый (x = ширина изображения, y=высота изображения).

Например, для изображения с разрешением 100 на 200 пикселей координаты будут такими:

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


Вот список функций, которые необходимы для прорисовки различных форм, а также для размещение текста на создаваемом изображении.
Для каждой функции вы найдете краткое описание синтаксиса и назначения.
Мы не ставим себе целью привести пример использования для каждой функции, здесь вы найдете только краткое описание. В таблице также указана версия библиотеки, начиная с которой поддерживается та или иная функция. Примеры употребления некоторых функций можно найти в разделе официального мануала, посвященного

Пример синтаксиса

Описание

Создает пустой холст (256 цветов) $im высотой $largeur и шириной $hauteur. (формат PNG предпочтителен)

Эта функция похожа на ImageCreate но глубина цвета изображения не ограничена 256 цветами. (формат JPEG предпочтителен)

Помещает в переменную $col цвет компонентами которого являются $rouge, $vert, $bleu (диапазон 0 .. 255).Подробности см. в первой части.

Создает эллипс на изображении $im с центром в точке ($x,$y), шириной $l, высотой $h и цветом $col.

Идентична ImageEllipse, но эллипс заполняется цветом $col

Создает на изображении $im прямоугольник цвета $col, расположенный между точкой с координатами ($x,$y) и нижним правым углом изображения цвета $col

Рисует линию цвета $col, которая проходит между двумя точками с координатами ($x1,$y1) и ($x2,$y2)

На изображении $im рисует многоугольник, координаты которого перечислены в массиве $points ($points=$x0, $points=$y0, $points=$x1, $points=$y1, и т. д.), $num_points – количество точек в массиве, $col - цвет.

Идентична ImagePolygo, но эллипс заполняется цветом $col

На изображении $im рисует прямоугольник, верхний левый угол которого имеет координаты ($x0, $y0) , а правый нижний ($x1, $y1). $col – цвет прямоугольника

Идентична ImageRectangle, но эллипс заполняется цветом $col

Эти функции позволяют изменить стиль прочерчиваемых линий. Для более подробной информации посмотрите официальную документацию, особенно обратите внимание на пример использования функции ImageSetStyle , который также является показательным для функции ImageSetBrush

В изображении $im рисует точку с координатами ($x,$y) и цветом $col

Меняет толщину линий, созданных различными функциями.

В изображении $im создает строку $chaine с координатами (левый верхний угол) ($x,$y) цвета $col $police - размер (гарнитура) шрифта (от 0 до 5)

Идентична ImageString , но строка выводится вертикально

III) Пример первый: статистика посещений сайта в виде графика

Чтобы применить полученные знания на практике – создадим простой скрипт-пример. Часто требуется представить статистику посещения сайта в форме гистограммы

Мы предполагаем, что вы уже разработали ту часть скрипта, которая отвечает за учет посетителей (возможно с использованием таблицы MySQL). Об ее реализации мы говорить здесь не будем, это не цель данной статьи. Допустим, что статистика посещений за каждый месяц помещена в массив $visites. В этой статье мы наполняем массив "вручную", но вы можете сделать это сами, используя данные вашей таблицы MySQL.

a) Статистика посещений: создание изображения и цвета

Начнем с создания массива, который содержит в себе статистику посещений сайта за 12 месяцев (12 элементов). Затем сгенерируем картинку разрешением 400х300 и создадим три цвета, один из которых (белый) будет цветом фона.

visites.php

$visites = array(138 , 254 , 381 , 652 , 896 , 720 , 140 , 556 , 663 , 331 , 407 , 768 );

Header ("Content-type: image/png" );
$largeurImage = 400 ;
$hauteurImage = 300 ;
$im = ImageCreate ($largeurImage , $hauteurImage )
or die ("Ошибка при создании изображения" );

$noir = ImageColorAllocate ($im , 0 , 0 , 0 );
$bleu = ImageColorAllocate ($im , 0 , 0 , 255 );
?>

b) Рисуем оси графика

Поместим горизонтальную ось времени (простая черная линия) в нижнюю часть изображения, оставив поле в 10 пикселов.

Внизу подписываем номер каждого из 12 месяцев, используя цикл for и функцию ImageString. Номера месяцев располагаются через каждые 30 пикселов, начиная с левой стороны изображения.

Наконец, проводим вертикальную линию, ось ординат статистики посещений.

// проводим горизонтальную линию, ось абсцисс (время)
ImageLine ($im, 10, $hauteurImage-10, $largeurImage-10, $hauteurImage-10, $noir);
// выводим порядковый номер каждого из 12 месяцев
for ($mois=1; $mois ImageString ($im, 0, $mois*30, $hauteurImage-10, $mois, $noir);
}

// проводим вертикальную линию, чтобы ось ординат (число посещений)
ImageLine ($im, 10, 10, 10, $hauteurImage-10, $noir);
?>

c) Рисуем палочки

Теперь переходим к более сложной задаче – рисованию палочек.

Для начала нам необходимо узнать максимальное число посетителей, которое мы представим на графике. Здесь мы выбрали случайное значение – 1000, но на самом деле вам, наверное, придется его вычислять, осуществляя запрос на максимальное значение столбца вашей таблицы MySQL. Мы же сделаем проще…

Для каждого месяца необходимо вычислить высоту создаваемого прямоугольника. Для этого необходимо решить уравнение, зная что высота прямоугольника (палочки) для максимального количества посещений будет равна высоте всего изображения. Исходя из количества посещений за определенный месяц мы получаем искомую высоту

Нам остается только прорисовать каждый прямоугольник, начиная с координат его верхнего левого угла и кончая нижним правым.

Добавим количество посещений за месяц над каждым прямоугольником для улучшения гистограммы.

// максимум посещений
$visitesMax = 1000 ;

// рисуем палочки
for ($mois = 1 ; $mois <= 12 ; $mois ++) {
$hauteurImageRectangle = round (($visites [ $mois - 1 ]* $hauteurImage )/ $visitesMax );
ImageFilledRectangle ($im , $mois * 30 - 7 , $hauteurImage - $hauteurImageRectangle , $mois * 30 + 7 , $hauteurImage - 10 , $bleu );
ImageString ($im , 0 , $mois * 30 - 7 , $hauteurImage - $hauteurImageRectangle - 10 , $visites [ $mois - 1 ], $noir );
}

// вот и все
ImagePng ($im );
?>

d) А вот и результат!

Результат, конечно, не назовешь превосходным, но следует учитывать, что нам удалось сделать что-то более или менее презентабельное, написав всего 20 строчек простого кода, что само по себе уже неплохо.

Гистограмма посещаемости по 12 месяцам.


IV) Другие полезные функции

Вот еще один набор полезных функций, предназначенных для управления цветовой палитрой, а также для получения различной информации об изображениях.

Описание

"Это функция использует в качестве параметра имя файла $fichier и возвращает массив, содержащий 4 элемента: (1) $tableau ширина изображения (px), (2) $tableau высота изображения (px), (3) $tableau тип изображения (см. документацию), (4) $tableau возвращает строку, которую можно вставить в тег IMG (width=""1024"" height=""768"")"

Области изображения $im, прорисованные цветом $col становятся прозрачными. Чтобы сохранить прозрачность, используйте формат PNG

Копируем прямоугольную область изображения $src_im на изображение $dst_im. Область копирования ограничена координатами точки верхнего левого угла($src_x, $src_y), шириной $src_l и высотой $src_h. Скопированная область появляется в изображении-реципиенте в точке с координатами. ($dst_x, $dst_y)

Идентична ImageCopy, в добавок к этому функция осуществляет постепенный переход тонов интенсивностью $intensite, которая принимает значения от 1 до 100.

Выполняет те же действие, что и ImageCopy, а также производит изменение размеров изображения. Смотрите следующий пример

Идентична ImageCopyResampled, но результат масштабирования менее четок, зато функция работает быстрее.

Возвращает идентификатор ресурса, $im, указывающий на изображение, которое находится в файле формата jpeg $fichier.

Возвращает идентификатор ресурса, $im, указывающий на изображение, которое находится в файле формата png $fichier.

Возвращает ширину изображения $im

Возвращает высоту изображения $im

V) Пример второй: генерация миниатюр (уменьшенных копий изображения)

Этот пример имеет целью создание уменьшенной копии существующего изображения. Возможно, вам придется реализовывать эту функцию при написании фотогалереи на РНР, в которой фотографии представлены в форме миниатюр, а посетитель может щелкнуть на них мышью, чтобы увеличить. В данном примере мы сгенерируем миниатюру, снабженную рамкой и некоторыми пояснениями (размер и имя изображения)

a) Начало

В отличие от первого примера, данный скрипт будет записывать изображение в файл, а не генерировать его на лету. Поэтому необходимость в отправке особого http-заголовка при помощи функции header() отпадает. Таким образом, скрипт становится "классическим" и может генерировать html.

Начнем с создания пустого холста размером 200х150, затем считаем существующее изображение (из файла) при помощи функции ImageCreateFromJpeg. Потом нам также могут понадобится размеры изображения-источника, для этого мы воспользуемся imagesx и imagesy.

miniature.php

$fichierSource = "photo3.jpg" ;

$largeurDestination = 200 ;
$hauteurDestination = 150 ;
$im = ImageCreateTrueColor ($largeurDestination , $hauteurDestination )
or die ("Ошибка при создании изображения" );

$source = ImageCreateFromJpeg ($fichierSource );

$largeurSource = imagesx ($source );
$hauteurSource = imagesy ($source );
?>

b) Рамка

Предварительно создав несколько цветов, рисуем рамку. Чтобы упростить задачу, мы будем использовать различные оттенки серого.

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

Толщина создаваемой нами рамки – 8 пикселов.

$blanc = ImageColorAllocate ($im , 255 , 255 , 255 );
$gris [ 0 ] = ImageColorAllocate ($im , 90 , 90 , 90 );
$gris [ 1 ] = ImageColorAllocate ($im , 110 , 110 , 110 );
$gris [ 2 ] = ImageColorAllocate ($im , 130 , 130 , 130 );
$gris [ 3 ] = ImageColorAllocate ($im , 150 , 150 , 150 );
$gris [ 4 ] = ImageColorAllocate ($im , 170 , 170 , 170 );
$gris [ 5 ] = ImageColorAllocate ($im , 190 , 190 , 190 );
$gris [ 6 ] = ImageColorAllocate ($im , 210 , 210 , 210 );
$gris [ 7 ] = ImageColorAllocate ($im , 230 , 230 , 230 );

For ($i = 0 ; $i <= 7 ; $i ++) {
ImageFilledRectangle ($im , $i , $i , $largeurDestination - $i , $hauteurDestination - $i , $gris [ $i ]);
}
?>

c) Создание миниатюры

Для создания миниатюры используется функция ImageCopyResampled. Она копирует одно изображения на другое, при этом может изменять размер копируемой области. Данная функция принимает несколько параметров, значение которых очевидно. Перечислим их по порядку:

  • ($im) Изображение-реципиент
  • ($source) Изображение-источник
  • Координата х области изображения-реципиента, на которую накладывается изображение-копия.
  • Координата y
  • Координата х копируемой области изображения-источника (0 если мы хотим скопировать все изображение)
  • Координата (y)
  • Ширина копии, которая вставляется на изображение-источник ($largeurDestination-(2*8) ширина изображения-реципиента минус ширина рамки справа и слева).
  • Высота копии (проделываем те же операции, что и с шириной)
  • Ширина копируемой области изображения-источника
  • , $hauteurSource );
    ImageString ($im , 0 , 12 , $hauteurDestination - 18 , " $fichierSource - ($largeurSource x $hauteurSource )" , $blanc );
    ?>

    d) Сохранение результата.

    Нам остается только сохранить полученный результат в файле, имя которого начинается с mini_. Это мы сделаем при помощи функции ImageJpeg.
    Когда эта функция имеет только один параметр, изображение выводится в браузер пользователя. Однако если в качестве второго параметра передается имя файла, никакого вывода в браузер не произойдет, а картинка будет сохранена в указанном файле. То же правило действует для функции ImagePng

    Мое изображение не выводится, браузер ведет себя так, как будто изображение не существует.
    Скорее всего ошибку следует искать в вашем скрипте. Сделайте комментарий из строки header("Content-type: image/png") (или header("Content-type: image/jpeg")), а также из строки ImagePng($im) (илиImageJpeg($im)), чтобы получить сообщение об ошибке

    Скрипт долго выполняется на моем хостинге, это нормально?
    Если вы используйте "тяжеловесные" функции как ImageCopyResampled, это неудивительно. У интерпретатора PHP, установленного на хостинге, и без этого работы хватает…

    Цвета моего изображения искажены (или оно выводится как черно-белое), почему?
    Скорее всего вы использовали функцию ImageCreate, которая ограничивает цветовую палитру 256 цветами. Чтобы преодолеть это ограничение используйте функцию ImageCreateTrueColor вместо ImageCreate.

    Заканчивая данную статью, покажем результат, который можно получить, скомбинировав два примера этой статьи. Тут к гистограмме мы добавили полутона, используя тот же метод, что и в примере 2.

    Результат


Если вы заядлый PHP разработчик, вы, наверняка, не только наслышаны о графической библиотеке GD library. Для тех, кто с ней не знаком, поясняю GD library позволяет создавать изображения, видоизменять и управлять ими без особых усилий. Сегодня, мы познакомимся с азами использования в PHP графической библиотеки GD library.

Прежде всего

Убедитесь, что GD библиотека установлена и активирована на вашем сервере. Не знаете как это сделать? Не переживайте, все просто! Вам только нужно создать PHP файл на сервере, затем введите следующее:

Теперь откройте страницу браузера и вы увидите громадный список возможностей вашей версии PHP. Прокрутите страницу немного вниз, найдите секцию ‘GD’ и убедитесь, что библиотека подключена. Если нет, свяжитесь с компанией, предоставляющей вам услуги хостинга. К счастью, на большинстве серверов, на которых я уже успел поработать и работаю, GD библиотека установлена и подключена.

Основные моменты

Давайте пройдемся по некоторым основным моментам. Во-первых, сделаем так, чтобы все отчеты об ошибках выдавались браузером. Этого можно добиться, введя в самом начале вашего php-кода следующее:

error_reporting(E_ALL);
?>

Нарисуем квадрат

Давайте начнем с самого простого и нарисуем с помощью PHP синий квадрат - ничего сверхъестественного, конечно, но надо же разобраться с основами. Чтобы получить желаемый квадрат, необходимо выполнить следующие действия:

Установить тип содержимого как «изображение», чтобы браузер смог интерпретировать изображение должным образом;
. Создать новое пустое изображение, установив нужную ширину и высоту;
. Сделать цвет фона синим;
. Сохранить окончательный вариант изображения и передать его в браузер;
. Очистить память, которая использовалась для создания и хранения изображения;
. Организовать отображение рисунка из файла index.php

Теперь, когда мы определились с порядком действий, можно начинать кодирование. Я постарался прокомментировать каждую строчку кода, а о функциях, использовавшихся в процессе кодировки, расскажу потом. Итак, вот код для создания нашего синего квадрата. После написания мы сохраним его под именем ‘basic_square.php’.

//Устанавливаем отображение сообщений об ошибках
ini_set ("display_errors", "1");
error_reporting(E_ALL);


//Определяем размеры изображения
//125px width, 125px height
$image = imagecreate(125, 125);

//Выбираем цвет фона
$blue = imagecolorallocate($image, 0, 0, 255);

//Устанавливаем еще один цвет - просто чтобы убедиться, что при отображении рисунка фоновым будет именно цвет, установленный первым ()
//Обратите внимание - квадрат будет синего, а не красного цвета.
$red = imagecolorallocate($image, 255, 0, 0);

//Сохраняем файл в формате png и выводим его
imagepng($image);

//Чистим использованную память
imagedestroy($image);
?>

Теперь давайте рассмотрим все использованные функции и каждый шаг вышеприведенного кода, чтобы лучше понять, что именно мы в нем делаем:

Как я уже пояснял, мы добавляем опцию сообщения об ошибках, чтобы в случае необходимости быстро их исправить
. Затем мы используем функцию header(), чтобы установить тип содержимого - png
. Сохраняем изображение и устанавливаем необходимую ширину и высоту - более подробно см. imagecreate()
. Затем используем функцию imagecolorallocate, чтобы выбрать синий цвет для фона нашего рисунка. Обратите внимание, что в окончательном варианте будет виден цвет, установленный в первую очередь, так что наш квадрат получится синим, а не красным.
. Для окончательного сохранения рисунка мы используем imagepng(). Если вы желаете сохранить рисунок в каком-либо каталоге, следует ввести дополнительные параметры.
. И, наконец, мы чистим память с помощью функции imagedestroy()

Мы можем посмотреть на нарисованный нами квадрат, открыв файл blue_square.php, а, еще лучше будет, если мы установить ссылку на него на главной странице:

Если все было сделано правильно, вы увидите вот такой синий квадрат:

Привет, Мир

Теперь, когда мы научились создавать изображения, давайте попробуем сделать изображение с текстом, написанным выбранным нами шрифтом. Мы можем воспользоваться любым шрифтом из каталога TrueType Font (.tff). В следующих примерах я буду использовать шрифт ‘Advent’. Давайте напишем «Hello World» на темно-сером квадрате. Внимание, смотрим на код, а затем подробно разбираем каждый шаг.

ini_set("display_errors", "1");
error_reporting(E_ALL);


header("content-type: image/png");

//Определяем размер изображения - 300x300 пикселей

//Устанавливаем фоновый темно-серый цвет

//Указываем путь к шрифту
$font_path = "advent_light";

//Пишем текст
$string = "Hello World!";

//Соединяем текст и картинку
imagettftext($image, 50, 0, 10, 160, $white, $font_path, $string);

//Сохраняем изображение
imagepng($image);

//Чистим память
imagedestroy($image);
?>

Сохраним код в файле ‘hello_world.php’и будем открывать его таким же способом, какой был указан выше. Итак, что здесь нового?

Мы установили размер изображения 300*300 пикселей и использовали темно-серый фон
. Обратите внимание, как мы указывали путь к шрифту, используя имя шрифта: дело в том, что далее в коде нам придется накладывать текст на изображение. Кроме того, не забывайте, что имя шрифта пишется без расширения. Впрочем, это зависит от того, какую версию GD-библиотеки использует PHP: если названием шрифта не начинается с ‘/’, то потребуется расширение ttf - то есть, если перед названием файла нашего шрифта не стоит /, то в конце будет автоматически добавлено ttf.
. Затем мы пишем «Hello World!» и сохраняем текст для дальнейшего использования
. Важнейшая функция, использованная в этом коде - это imagettftext(), требующая указания 8 параметров: путь к изображению, размер изображения, угол наклона, ось x, ось y, цвет, шрифт, текст (в таком порядке)

Сохраните код, откройте его любым способом, и вы увидите вот такую картинку:

Поверните его!

Вы заметили, что у функкции imagettftext, соединяющей текст и картинку, есть параметр расположить под углом"? Значит, мы можем повернуть наш текст под любым углом. Давайте перепишем код и повернем строчку на квадрате.

//Устанавливаем сообщения об ошибках
ini_set("display_errors", "1");
error_reporting(E_ALL);

//Устанавливаем тип содержимого
header("content-type: image/png");

//Определяем размер изображения: 300x300 пикселей
$image = imagecreate(300, 300);

//Определяем цвет фона - темно-серый
$dark_grey = imagecolorallocate($image, 102, 102, 102);
$white = imagecolorallocate($image, 255, 255, 255);

//Указываем путь к шрифту
$font_path = "advent_light";

//Пишем текст
$string = "Hello World!";

//Соединяем текст и картинку
imagettftext($image, 50, -45, 30, 70, $white, $font_path, $string);

//Сохраняем изображение
imagepng($image);

//Чистим память
imagedestroy($image);
?>

Обратите внимание, мы установили значение -45 градусов вместо 0 градусов (как в предыдущем примере) - это все, что требуется для того, чтобы повернуть текст. Посмотрите на картинку.

Ну как? Интересно? Нет? Тогда давайте попробуем заняться чем-нибудь более практичным.

Какое сегодня число?

Мы можем не только сами рисовать картинки, но и использовать готовые! Немного кодировки, и у нас получится календарик, отображающий текущую дату (месяц, день и год). Ищем в Google заготовку для календаря, находим изображение в формате.svg - я изменил его размер и перевел в формат png. Посмотрите на заготовку:

Теперь у нас есть основа, и мы можем обработать ее с помощью функций GD и PHP. Предупреждаю, что я не претендую на звание величайшего в мире дизайнера - возможно, на сайте лучше смотрелась бы другая заготовка и другой шрифт. Так что дизайн за вами, а пока давайте посмотрим на код:

//Устанавливаем сообщения об ошибках
ini_set("display_errors", "1");
error_reporting(E_ALL);

//Устанавливаем тип содержимого

//Сохраняем дату
list($month, $day, $year) = explode("/", date("F/jS/Y"));

//Загружаем фоновое изображение
$image = imagecreatefrompng("calendar_blank.png");
$image_width = imagesx($image);

//Определяем цвет фона и шрифт
$white = imagecolorallocate($image, 255, 255, 255);
$black = imagecolorallocate($image, 0, 0, 0);
$font_path = "advent_light";

//Указываем позиции текста
$pos_month = imagettfbbox(13, 0, $font_path, $month);
$pos_day = imagettfbbox(25, 0, $font_path, $day);
$pos_year = imagettfbbox(8, 0, $font_path, $year);

//Пишем месяц
imagettftext($image, 13, 0, ($image_width - $pos_month) / 2, 40, $white, $font_path, $month);

//Пишем день
imagettftext($image, 25, 0, ($image_width - $pos_day) / 2, 80, $black, $font_path, $day);

//Пишем год
imagettftext($image, 8, 0, ($image_width - $pos_year) / 2, 100, $black, $font_path, $year);

//Сохраняем изображение
imagejpeg($image, "", 100);

//Чистим память
imagedestroy($image);
?>

Итак, что мы здесь делаем? Что за функция list()? Давайте разберемся:

Как всегда, мы устанавливаем тип содержимого, чтобы картинка отображалась правильно.
. В 10-й строчке вы видите функцию list function. Мы определяем формат даты с помощью функции explode() и сохраняем его. Таким образом можно упорядочивать любую информацию. Теперь нам открыт доступ к сведениям о текущем месяце, дне и годе.
. В строчках 22-24 мы пользуемся функцией imagettfbbox(), чтобы организовать формат даты. Функция обеспечивает отображение даты в заданном порядке, а для доступа к правому нижнему углу мы пишем $pos_month. Все это нужно для того, чтобы текст автоматически располагался правильно, не зависимо от его размера.
. Затем мы создаем каждую строчку по очереди и устанавливаем размер текста по оси Х.

Если не произошло никаких катастроф, у вас должна получиться представленная ниже картинка, с той лишь разницей, что дата будет той, что установлена на вашем компьютере - мой рисунок, как вы можете догадаться, статичен. За помощь со скриптом спасибо сайту catpin.

Кошки и фильтры изображений

Последнее, чему я сегодня вас научу, это фильтры изображений - очень интересная штука, поверьте мне. Функция imagefilter() берет готовое изображение и определенным образом изменяет его - например, переводит в черно-белый режим. Давайте посмотрим на картинку, с которой мы будем работать, в ее первоначальном виде.

А теперь сделаем кота черно-белым с помощью функции фильтрации изображений.

//Устанавливаем сообщения об ошибках
ini_set("display_errors", "1");
error_reporting(E_ALL);

//проверяем, установлено ли исходное изображение
if(isset($_GET["source"])){
//выполняем базовую обработку рисунка
$image = filter_var($_GET["source"], FILTER_SANITIZE_STRING);

//Загружаем изображение
$image = imagecreatefromjpeg($image);

//Переводим его в черно-белый режим
imagefilter($image, IMG_FILTER_GRAYSCALE);

//Устанавливаем тип содержимого
header("content-type: image/jpeg");

//Сохраняем изображение в качестве 90%
imagejpeg($image, "", 90);

//чистим память
imagedestroy($image);
}
?>

Вышеприведенный скрипт является достаточно гибким, так что вы без труда сможете сделать любой рисунок черно-белым - вот так:

Ставим в «источник» любую картинку, и вскоре она станет черно-белой. Тем, кто планирует использовать эту функцию на общедоступных серверах, потребуются дополнительные меры безопасности. Хотя в вышеприведенном скрипте указано изображение типа.jpeg, вы можете применять функцию для обработки любых графических файлов. Теперь наш кот выглядит так:

Другие фильтры:

В завершение урока я познакомлю вас с некоторыми другими графическими фильтрами и результатами их применения

Фильтр яркости

За яркость изображения отвечает третий параметр:


//третий параметр устанавливает уровень яркости изображения.
imagefilter($image, IMG_FILTER_BRIGHTNESS, 40);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Гауссово размывание

Размывание по Гауссу, никаких дополнительных параметров

header("content-type:image/jpeg");

$image = imagecreatefromjpeg("cat.jpg");
imagefilter($image, IMG_FILTER_GAUSSIAN_BLUR);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Контрастность

Третий параметр определяет контрастность

header("content-type: image/jpeg");
$image = imagecreatefromjpeg("cat.jpg");
imagefilter($image, IMG_FILTER_CONTRAST, -15);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Удаление среднего значения (эффект рисунка)

Никаких дополнительных параметров.

header("content-type: image/jpeg");
$image = imagecreatefromjpeg("cat.jpg");
imagefilter($image, IMG_FILTER_MEAN_REMOVAL);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

Цветовой баланс

Устанавливает насыщенность красного, зеленого, синего цветов, а также альфа-канала (по желанию) в перечисленном порядке

header("content-type:image/jpeg");
$image = imagecreatefromjpeg("cat.jpg");
//alpha channel parameter omitted below as it is optional.
imagefilter($image, IMG_FILTER_COLORIZE, 50, 0, 0);
imagejpeg($image, "", 90);
imagedestroy($image);
?>

До новых встреч...

Надеюсь, что вы более или менее разобрались с использованием в PHP библиотеки GD. Во второй части мы рассмотрим некоторые продвинутые техники и, конечно, узнаем еще больше интересного. Используйте библиотеку GD и свои творческие способности и обязательно расскажите мне, что у вас получилось!

В этой статье подробно разберём механизм загрузки изображений на сервер с помощью PHP не прибегая к сторонним компонентам и фреймворкам. Научимся безопасно загружать изображения не только с локальной машины пользователя, но и удалённые файлы по ссылке. Все примеры кода я буду писать в процедурном стиле, дабы вы быстрее могли читать код, а не перескакивать с одного метода на другой. Руководство полностью авторское и не претендует на какую-либо академичность изложения .

§1. Общие принципы

Всю последовательность загрузки изображения на сервер можно отобразить следующим образом: настройка php.ini получение файла проверка безопасности валидация данных сохранение на диск . Процесс загрузки картинки с компьютера пользователя или по URL ничем не отличаются, за исключением способа получения изображения и его сохранения. Общая схема загрузки картинки на сервер выглядит следующим образом:

Для валидации картинки по URL мы будем использовать функцию getimagesizefromstring() , т. к. cURL скачает её в переменную для дальнейших манипуляций.

Поскольку мы загружаем изображения на сервер, то хорошо было бы проверять их определённые параметры: ширину , высоту , тип картинки, размер файла в байтах. Это зависит от логики вашего приложения, но для наглядности в этом руководстве мы проверим все вышеописанные параметры.

§2. Правила безопасности

Безопасность загрузки изображений сводится к недопущению попадания на сервер чужеродного кода и его выполнения. На практике загрузка картинок наиболее уязвимое место в PHP-приложениях: попадание shell-скриптов , запись вредоносного кода в бинарные файлы , подмена EXIF-данных . Для того, чтобы избежать большинства методов взлома нужно придерживаться следующих правил:

а не доверять данным из $_FILES;
б не проверять MIME-тип картинки из функции getimagesize();
в загружаемому файлу генерировать новое имя и расширение;
г запретить выполнение PHP-скриптов в папке с картинками;
д не вставлять пользовательские данные через require и include;
е для $_FILES использовать is_uploaded_file() и move_uploaded_file().

Если есть чем дополнить «Правила безопасности», тогда оставляйте свои замечания или ссылки на статьи по безопасности в комментариях к этому руководству, а я опубликую их в этом параграфе.

§3. Конфигурация php.ini

PHP позволяет внести определённые конфигурационные значения в процесс загрузки любых файлов. Для этого необходимо в файле php.ini найти блоки «Resource Limits », «Data Handling » и «File Uploads », а затем отредактировать, по необходимости, следующие значения:

; Максимальное время выполнения скрипта в секундах max_execution_time = 60 ; Максимальное потребление памяти одним скриптом memory_limit = 64M ; Максимально допустимый размер данных отправляемых методом POST post_max_size = 5M ; Разрешение на загрузку файлов file_uploads = On ; Папка для хранения файлов во время загрузки upload_tmp_dir = home/user/temp ; Максимальный размер загружаемого файла upload_max_filesize = 5M ; Максимально разрешённое количество одновременно загружаемых файлов max_file_uploads = 10

Исходя из указанных значений, пользователь не сможет за один раз загрузить больше десяти файлов, причём каждый файл не должен превышать 5 Мбайт. Параметры из блока «Resource Limits » больше нужны для загрузки удалённого файла, т. к. с помощью cURL мы будем скачивать содержимое в переменную и проверять её по нужным нам критериям, а для этого необходимо дополнительное время и память.

Конфигурационный файл php.ini всегда необходимо настраивать согласно бизнес-логики разрабатываемого веб-приложения. Например, мы планируем загружать не более десяти файлов до 5 Мбайт, а это значит нам понадобиться ~50 Мбайт памяти. Кроме того, нам нужно знать максимальное время загрузки одного файла с локальной машины и по ссылке, дабы установить достаточное время выполнения скрипта в max_execution_time и не пугать пользователей ошибками.

§4. Загрузка картинок из формы

Сейчас мы не будем рассматривать загрузку нескольких файлов на сервер, а разберём лишь саму механику загрузки на примере одного файла. Итак, для загрузки картинки с компьютера пользователя необходимо с помощью HTML-формы отправить файл PHP-скрипту методом POST и указать способ кодирования данных enctype="multipart/form-data" (в данном случае данные не кодируются и это значение применяется только для отправки бинарных файлов). С формой ниже мы будем работать дальше:

Для поля выбора файла мы используем имя name="upload" в нашей HTML-форме, хотя оно может быть любым. После отправки файла PHP-скрипту file-handler.php его можно перехватить с помощью суперглобальной переменной $_FILES["upload"] с таким же именем, которая в массиве содержит информацию о файле:

Array ( => picture.jpg // оригинальное имя файла => image/jpeg // MIME-тип файла => home\user\temp\phpD07E.tmp // бинарный файл => 0 // код ошибки => 17170 // размер файла в байтах )

Не всем данным из $_FILES можно доверять: MIME-тип и размер файла можно подделать, т. к. они формируются из HTTP-ответа, а расширению в имени файла не стоит доверять в силу того, что за ним может скрываться совершенно другой файл. Тем не менее, дальше нам нужно проверить корректно ли загрузился наш файл и загрузился ли он вообще. Для этого необходимо проверить ошибки в $_FILES["upload"]["error"] и удостовериться, что файл загружен методом POST с помощью функции is_uploaded_file() . Если что-то идёт не по плану, значит выводим ошибку на экран.

// Перезапишем переменные для удобства $filePath = $_FILES ["upload" ]["tmp_name" ]; $errorCode = $_FILES ["upload" ]["error" ]; // Проверим на ошибки if ($errorCode !== UPLOAD_ERR_OK || ! is_uploaded_file ($filePath )) { // Массив с названиями ошибок $errorMessages = [ UPLOAD_ERR_INI_SIZE => "Размер файла превысил значение upload_max_filesize в конфигурации PHP." , UPLOAD_ERR_FORM_SIZE => "Размер загружаемого файла превысил значение MAX_FILE_SIZE в HTML-форме." , UPLOAD_ERR_PARTIAL => "Загружаемый файл был получен только частично." , UPLOAD_ERR_NO_FILE => "Файл не был загружен." , UPLOAD_ERR_NO_TMP_DIR => "Отсутствует временная папка." , UPLOAD_ERR_CANT_WRITE => "Не удалось записать файл на диск." , UPLOAD_ERR_EXTENSION => "PHP-расширение остановило загрузку файла." , ]; // Зададим неизвестную ошибку $unknownMessage = "При загрузке файла произошла неизвестная ошибка." ; // Если в массиве нет кода ошибки, скажем, что ошибка неизвестна $outputMessage = isset ($errorMessages [$errorCode ]) ? $errorMessages [$errorCode ] : $unknownMessage ; // Выведем название ошибки die ($outputMessage ); }

Для того, чтобы злоумышленник не загрузил вредоносный код встроенный в изображение, нельзя доверять функции getimagesize() , которая также возвращает MIME-тип. Функция ожидает, что первый аргумент является ссылкой на корректный файл изображения . Определить настоящий MIME-тип картинки можно через расширение FileInfo . Код ниже проверит наличие ключевого слова image в типе нашего загружаемого файла и если его не окажется, выдаст ошибку:

// Создадим ресурс FileInfo $fi = finfo_open (FILEINFO_MIME_TYPE); // Получим MIME-тип $mime = (string) finfo_file ($fi , $filePath ); );

На данном этапе мы уже можем загружать абсолютно любые картинки на наш сервер, прошедшие проверку на MIME-тип, но для загрузки изображений по определённым характеристикам нам необходимо валидировать их с помощью функции getimagesize() , которой скормим сам бинарный файл $_FILES["upload"]["tmp_name"] . В результате мы получим массив максимум из 7 элементов :

Array ( => 1280 // ширина => 768 // высота => 2 // тип => width="1280" height="768" // аттрибуты для HTML => 8 // глубина цвета => 3 // цветовая модель => image/jpeg // MIME-тип )

Для дальнейшей валидации изображения и работы над ним нам необходиом знать только 3 значения: ширину , высоту и размер файла (для вычисления размера применим функцию filesize() для бинарного файла из временной папки).

// Результат функции запишем в переменную $image = getimagesize ($filePath ); $limitBytes = 1024 * 1024 * 5 ; $limitWidth = 1280 ; $limitHeight = 768 ; // Проверим нужные параметры if (filesize ($filePath ) > $limitBytes ) die ("Размер изображения не должен превышать 5 Мбайт." ); if ($image > $limitHeight ) die (); if ($image > $limitWidth ) die ();

После всех проверок мы можем с уверенностью переместить наш загружаемый файл в какую-нибудь папку с картинками. Делать лучше это через функцию move_uploaded_file() , которая работает в безопасном режиме. Перед перемещением файла нельзя забыть сгенерировать случайное имя и расширение из типа изображения для нашего файла. Вот так это выглядит:

// Сгенерируем новое имя файла на основе MD5-хеша $name = md5_file ($filePath ); // Сократим.jpeg до.jpg // Переместим картинку с новым именем и расширением в папку /pics if (! move_uploaded_file ($filePath , __DIR__ . "/pics/" . $name . $format )) { die ("При записи изображения на диск произошла ошибка." ); }

На этом загрузка изображения завершена. Для более удобной загрузки файлов можете использовать класс UploadedFile из пакета Symfony HttpFoundation , который является обёрткой для $_FILES и также сохраняет файл через move_uploaded_file() .

§5. Загрузка изображения по ссылке

Для загрузки изображения по ссылке нам понадобиться библиотека cURL , которая работает с удалёнными ресурсами. С помощью неё мы скачаем контент в переменную. С одной стороны может показаться, что для этих целей подойдёт file_get_contents() , но на самом деле мы не сможем контролировать объём скачиваемых данных и нормально обрабатывать все возникшие ошибки. Для того, чтобы cURL корректно скачал данные нам нужно: разрешить следовать перенаправлениям , включить проверку сертификата , указать максимальное время работы cURL (формируется за счёт объёма скачиваемых данных и средней скорости работы с ресурсом). Как правильно скачать файл в переменную показано ниже с необходимыми параметрами :

// Каким-то образом получим ссылку $url = "https://site.ru/picture.jpg" ; // Проверим HTTP в адресе ссылки if (! preg_match ("/^https?:/i" , $url ) && filter_var ($url , FILTER_VALIDATE_URL)) { die ("Укажите корректную ссылку на удалённый файл." ); } // Запустим cURL с нашей ссылкой $ch = curl_init ($url ); // Укажем настройки для cURL curl_setopt_array ($ch , [ // Укажем максимальное время работы cURL CURLOPT_TIMEOUT => 60 , // Разрешим следовать перенаправлениям CURLOPT_FOLLOWLOCATION => 1 , // Разрешим результат писать в переменную CURLOPT_RETURNTRANSFER => 1 , // Включим индикатор загрузки данных CURLOPT_NOPROGRESS => 0 , // Укажем размер буфера 1 Кбайт CURLOPT_BUFFERSIZE => 1024 , // Напишем функцию для подсчёта скачанных данных // Подробнее: http://stackoverflow.com/a/17642638 CURLOPT_PROGRESSFUNCTION => function ($ch , $dwnldSize , $dwnld , $upldSize , $upld ) { // Когда будет скачано больше 5 Мбайт, cURL прервёт работу if ($dwnld > 1024 * 1024 * 5 ) { return - 1 ; } }, // Включим проверку сертификата (по умолчанию) CURLOPT_SSL_VERIFYPEER => 1 , // Проверим имя сертификата и его совпадение с указанным хостом (по умолчанию) CURLOPT_SSL_VERIFYHOST => 2 , // Укажем сертификат проверки // Скачать: https://curl.haxx.se/docs/caextract.html CURLOPT_CAINFO => __DIR__ . "/cacert.pem" , ]); $raw = curl_exec ($ch ); // Скачаем данные в переменную $info = curl_getinfo ($ch ); // Получим информацию об операции $error = curl_errno ($ch ); // Запишем код последней ошибки // Завершим сеанс cURL curl_close ($ch );

Если всё прошло успешно и cURL уложился в 60 секунд, тогда содержимое по ссылке будет скачано в переменную $raw . Кроме того, функция curl_getinfo() вернёт информацию о проделанном запросе, откуда мы можем получить дополнительную информацию для анализа работы с удалёнными ресурсами:

Array ( => image/jpeg // MIME-тип из Content-Type => 200 // последний HTTP-код => 0 // количество перенаправлений => 0.656 // общее время работы cURL => 0.188 // время на соединение с хостом => 4504 // реальный размер полученных данных => 4504 // размер данных из Content-Length /* ... */ )

Дальше нам нужно проверить нет ли ошибок в curl_errno() и удостовериться, что ресурс отдаёт HTTP-код равный 200, иначе мы скажем, что по такому-то URL ничего не найдено. После всех проверок переменную $raw передаём в getimagesizefromstring() и работаем уже по отработанной схеме как в случае с загрузкой картинок из формы.

Обратите внимание, что мы валидируем размер файла в момент получения данных, т. к. мы не можем на 100% доверять curl_getinfo(), поскольку значения content_type, http_code, download_content_length формируются на основе полученных HTTP-заголовков. Скачивать файл полностью, а потом проверять количество байт потребует много времени и памяти. Поэтому мы контролировали размер получаемых данных с помощью опции CURLOPT_PROGRESSFUNCTION: как только cURL получит больше данных, чем наш лимит, он прекратит работу и выдаст ошибку CURLE_ABORTED_BY_CALLBACK.

// Проверим ошибки cURL и доступность файла if ($error === CURLE_OPERATION_TIMEDOUT) die ("Превышен лимит ожидания." ); if ($error === CURLE_ABORTED_BY_CALLBACK) die ("Размер не должен превышать 5 Мбайт." ); if ($info ["http_code" ] !== 200 ) die ("Файл не доступен." ); // Создадим ресурс FileInfo $fi = finfo_open (FILEINFO_MIME_TYPE); // Получим MIME-тип используя содержимое $raw $mime = (string) finfo_buffer ($fi , $raw ); // Закроем ресурс FileInfo finfo_close ($fi ); // Проверим ключевое слово image (image/jpeg, image/png и т. д.) if (strpos ($mime , "image" ) === false ) die ("Можно загружать только изображения." ); // Возьмём данные изображения из его содержимого $image = getimagesizefromstring($raw ); // Зададим ограничения для картинок $limitWidth = 1280 ; $limitHeight = 768 ; // Проверим нужные параметры if ($image > $limitHeight ) die ("Высота изображения не должна превышать 768 точек." ); if ($image > $limitWidth ) die ("Ширина изображения не должна превышать 1280 точек." ); // Сгенерируем новое имя из MD5-хеша изображения $name = md5 ($raw ); // Сгенерируем расширение файла на основе типа картинки $extension = image_type_to_extension ($image ); // Сократим.jpeg до.jpg $format = str_replace ("jpeg" , "jpg" , $extension ); // Сохраним картинку с новым именем и расширением в папку /pics if (! file_put_contents (__DIR__ . "/pics/" . $name . $format , $raw )) { die ("При сохранении изображения на диск произошла ошибка." ); }

Для сохранения изображения на диск можно воспользоваться file_put_contents() , которая запишет контент в файл. Новое имя файла мы создадим через функцию md5() , а расширение сделаем из image_type_to_extension() . Теперь мы можем загружать любые картинки по ссылке.

§6. Настройка выбора нескольких файлов

В этом параграфе разберём способы загрузки нескольких изображений за один раз с локальной машины пользователя и по удалённым ссылкам. Для отправки ссылок мы задействуем $_POST и передадим ей все данные с помощью тега textarea . Для загрузки файлов из формы мы продолжим дальше работать с $_FILES . Наша новая HTML-форма будет немного отличаться от старой.

В конец имени поля выбора файла name="upload" добавились фигурные скобки и аттрибут multiple , который разрешает браузеру выбрать несколько файлов. Все файлы снова загрузятся во временную папку, если не будет никаких ошибок в php.ini . Перехватить их можно в $_FILES , но на этот раз суперглобальная переменная будет иметь неудобную структуру для обработки данных в массиве. Решается эта задача небольшими манипуляциями с массивом:

// Изменим структуру $_FILES foreach ($_FILES ["upload" ] as $key => $value ) { foreach ($value as $k => $v ) { $_FILES ["upload" ][$k ][$key ] = $v ; } // Удалим старые ключи unset ($_FILES ["upload" ][$key ]); } // Загружаем все картинки по порядку foreach ($_FILES ["upload" ] as $k => $v ) { // Загружаем по одному файлу $_FILES ["upload" ][$k ]["tmp_name" ]; $_FILES ["upload" ][$k ]["error" ]; }

Для загрузки нескольких картинок по URL передадим наши ссылки через textarea с именем name="upload" , где их можно указать через пробел или с новой строки. Функция preg_split разберёт все данные из $_POST["upload"] и сформирует массив, по которому нужно пройтись циклом и каждый валидный URL отправить в обработчик.

$data = preg_split ("/\s+/" , $_POST ["upload" ], - 1 , PREG_SPLIT_NO_EMPTY); foreach ($data as $url ) { // Валидируем и загружаем картинку по URL }