Php скрипт оптимизация изображений

Сжимаем размер картинки на PHP. Обработчик картинок classSimpleImage .

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

1. Достаточном месте на сервере для размещения графики.
2. Достаточной для обработки графики процессорной мощности.
3. Реализации динамической оптимизации загружаемого графического контента.

В первых двух пунктах всё в принципе решается выбором хостинг провайдера и лимитов тарифа. Читайте: «Какой выбрать хостинг.»

К процедуре оптимизации загружаемой на сервер графики можно отнести функции:

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

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

Для теста я ограничил размер картинки до 250px по высоте и ширине. А максимальный вес файла в 600кб. Теперь:

• Если файл типа png или gif по габаритам меньше ограничений, то он запишется на сервер без трансформации. Если это jpg , то осуществиться компрессия файла, согласно качеству заданному в форме отправки.
• Если файл по габаритам больше лимитного ограничения, то он будет вписан в установленные максимальные размеры, в Demo это 250px.
• Если файл весит больше 600kb, то пользователь получит предупреждение о превышении лимита, а сам файл обрабатываться не будет.
• И, наконец, если файл не проходит проверки или пришёл пустой запрос, то появится соответствующее предупреждение об отсутствии файла.

Для реализации поставленных задач был использован, обнаруженный на просторах интернета и немного мной доработанный, PHP класс « classSimpleImage.php » Скачать.

В листинге ниже привожу комментированный код php принимающей стороны:

//Подключаем классclassSimpleImage include_once('./classSimpleImage.php'); //Определяем протокол $protocol = isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == 'on' ? "https://" : "http://"; //Вносим в массив разрешённые источники отправки $accepted_origins = array("http://localhost", "http://192.168.1.1", "https://my-skills.ru"); //Производим проверки if (isset($_SERVER['HTTP_ORIGIN'])) < // запросы с одинаковым источником не будут устанавливать источник. Если источник установлен, он должен быть действительным. if (in_array($_SERVER['HTTP_ORIGIN'], $accepted_origins)) < //Заголовки если принимать через ajax //header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']); return; $flag = true; >else < //header("HTTP/1.1 403 Origin Denied"); return; $flag = false; >> // Не пытайтесь обработать загрузку по запросу OPTIONS. if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') < //header("Access-Control-Allow-Methods: POST, OPTIONS"); return; >if (is_uploaded_file($_FILES['userimg']['tmp_name']) and $flag === true) < //Получаем параметры качества $compession = trim(strip_tags($_POST['compression'])) * 1; //Путь к папке загрузки $imageFolder = "./img/"; reset ($_FILES); $temp = current($_FILES); // Sanitize input Очистить ввод if (preg_match("/([^wsd-_~,;:[]().])|([.])/", $temp['name'])) < header("HTTP/1.1 400 Invalid file name."); return; //В Demo я не провожу эту проверку на соответствие имени файла //$flag = false; >// Проверить расширение if (!in_array(strtolower(pathinfo($temp['name'], PATHINFO_EXTENSION)), array("gif", "jpg", "png"))) < //header("HTTP/1.1 400 Invalid extension."); return; $flag = false; >> if (is_uploaded_file($temp['tmp_name']) and $flag === true) < /* Если вашему сценарию необходимо получать файлы cookie, установите images_upload_credentials : true в конфигурацию и включите следующие два заголовка. */ // header('Access-Control-Allow-Credentials: true'); // header('P3P: CP="There is no P3P policy."'); $tempsize = $temp["size"].' Байт ';//Размер получаемого файла //Проверяем на превышение размера 600kb if($temp["size"] >600000)< //Картинка предупреждение "MAX SIZE IMG" $imgurl = "img/max-size-img-250.png"; >else< // Принять загрузку, если не было источника или если это принятый источник $ext = mb_strtolower(mb_substr(mb_strrchr($temp['name'], '.'), 1)); $filetowrite = $imageFolder . 'demo-45.'.$ext; $imgurl = 'img/demo-45.'.$ext; list($width, $height) = getimagesize($temp['tmp_name']); $nwh = 250; if (($width >= $nwh) || ($height >= $nwh)) < if($width >$height)< $rez = $nwh * 100 / $width; >else < $rez = $nwh * 100 / $height;>// Класс для сжатия графики $image = new SimpleImage(); //Загружаем исходную картинку $image->load($temp['tmp_name']); //Трансформируем $image->scale($rez); //Запись в папку + компрессия $image->save($filetowrite, exif_imagetype($temp['tmp_name']), $compession); >else< //Запись без трансформации $image->save($filetowrite, exif_imagetype($temp['tmp_name']), $compession); > > > else < //Картинка предупреждение "NO IMAGES" $imgurl = 'img/no-images-240.png'; >

Класс classSimpleImage.php

class SimpleImage < var $image; var $image_type; function load($filename) < $image_info = getimagesize($filename); $this->image_type = $image_info[2]; if( $this->image_type == IMAGETYPE_JPEG ) < $this->image = imagecreatefromjpeg($filename); > elseif( $this->image_type == IMAGETYPE_GIF ) < $this->image = imagecreatefromgif($filename); > elseif( $this->image_type == IMAGETYPE_PNG ) < $this->image = imagecreatefrompng($filename); > > function save($filename, $image_type=IMAGETYPE_JPEG, $compression=40, $permissions=null) < if( $image_type == IMAGETYPE_JPEG ) < imagejpeg($this->image,$filename,$compression); > elseif( $image_type == IMAGETYPE_GIF ) < imagegif($this->image,$filename); > elseif( $image_type == IMAGETYPE_PNG ) < imagepng($this->image,$filename); > if( $permissions != null) < chmod($filename,$permissions); >> function output($image_type=IMAGETYPE_JPEG) < if( $image_type == IMAGETYPE_JPEG ) < imagejpeg($this->image); > elseif( $image_type == IMAGETYPE_GIF ) < imagegif($this->image); > elseif( $image_type == IMAGETYPE_PNG ) < imagepng($this->image); > > function getWidth() < return imagesx($this->image); > function getHeight() < return imagesy($this->image); > function resizeToHeight($height) < $ratio = $height / $this->getHeight(); $width = $this->getWidth() * $ratio; $this->resize($width,$height); > function resizeToWidth($width) < $ratio = $width / $this->getWidth(); $height = $this->getheight() * $ratio; $this->resize($width,$height); > function scale($scale) < $width = $this->getWidth() * $scale/100; $height = $this->getheight() * $scale/100; $this->resize($width,$height); > function resize($width,$height) < $new_image = imagecreatetruecolor($width, $height); //Отключаем режим сопряжения цветов imagealphablending($new_image, false); //Включаем сохранение альфа канала imagesavealpha($new_image, true); imagecopyresampled($new_image, $this->image, 0, 0, 0, 0, $width, $height, $this->getWidth(), $this->getHeight()); $this->image = $new_image; > >

Дата публикации: 2023-03-13

Источник

How To Compress Images In PHP (Simple Examples)

Welcome to a tutorial on how to compress images in PHP. So you need to do some image compression to save some disk space? Probably to speed up the loading as well?

• Create an image object from the original image – $img = imagecreatefromjpeg(«ORIGINAL.JPG»);
• Compress the image by either changing the file format and/or reducing the quality.
  • imagejpeg($img, «COMPRESSED.JPG», 50);
  • imagewebp($img, «COMPRESSED.WEBP», 50);

  That covers the quick-and-dirty solution for people who are working with JPG files. But how about the other formats? What if we need to resize the image as well? Read on for a simple image compress library that I have created – Read on!

  TLDR – QUICK SLIDES

  

  TABLE OF CONTENTS

  PHP COMPRESS IMAGE

  All right, let us now get into the examples of how to compress images in PHP – Using the GD extension.

  PART 1) SIMPLE IMAGE COMPRESSION

  // (A) IMAGE OBJECT $img = imagecreatefrompng("demo.png"); imagepalettetotruecolor($img); // (B) COMPRESS IMAGE // (B1) BY REDUCING QUALITY imagejpeg($img, "demoA.jpg", 50); // (B2) BY CHANGING IMAGE FILE TYPE & REDUCING QUALITY imagewebp($img, "demoA.webp", 50); echo "DONE";

  

  For you guys who are new, I will keep things as simple as possible. There are 2 “basic types” of images:

  • Lossless – Doesn’t suffer quality loss when compressed, but usually large in file size. E.G. BMP, TIFF, RAW.
  • Lossy – Suffers quality loss when compressed (blurry image), but usually small in file size. E.G. JPG, WEBP.
  1. imagecreatefromjpeg(IMAGE FILE) Creates an image object from the given file. Take note, there are respective functions to open different image types – imagecreatefrompng() imagecreatefromwebp imagecreatefrombmp() .
  2. imagejpeg(IMAGE OBJECT, FILE, QUALITY) Save to specified file, QUALITY is a number from 0 (lowest) to 100 (highest). Similarly, imagewebp(IMAGE OBJECT, FILE, QUALITY) .

  PART 2) RESIZING IMAGES

  

  To further bring the file size down, we can permanently resize the image. GD2 provides a very simple function to do that – imagescale(IMAGE OBJECT, WIDTH, HEIGHT) . Yep, that’s all.

  P.S. Do this at your own discretion… Once resized, there will be a quality loss.

  PART 3) IMAGE COMPRESS FUNCTION – RESIZE & COMPRESS

  function packi ($from, $to, $mw=null, $mh=null, $quality=null) < // (A) CHECKS // (A1) SOURCE IMAGE IS READABLE if (!is_readable($from)) < exit("Cannot read $from"); >// (A2) ALLOWED IMAGE FILE FORMATS $extFrom = strtolower(pathinfo($from, PATHINFO_EXTENSION)); $extTo = strtolower(pathinfo($to, PATHINFO_EXTENSION)); if (!in_array($extFrom, ["jpeg", "jpg", "gif", "png", "bmp", "webp"])) < exit("$from - Invalid file format"); >if (!in_array($extTo, ["jpeg", "jpg", "gif", "png", "webp"])) < exit("$from - Invalid file format"); >// (B) OPEN SOURCE IMAGE $fn = "imagecreatefrom" . ($extFrom=="jpg" ? "jpeg" : $extFrom); $img = $fn($from); // (C) RESIZE IMAGE if ($mw!=null || $mh!=null) < // (C1) SOURCE IMAGE DIMENSIONS $sw = imagesx($img); $sh = imagesy($img); // (C2) RESIZE RATIO if ($mw != null && $sw>$mw) < $rw = $mw / $sw; >else < $rw = 1; >if ($mh != null && $sh>$mh) < $rh = $mh / $sh; >else < $rh = 1; >// (C3) RESIZE USING THE SMALLER RATIO if ($rw!=1 || $rh!=1) < $rr = $rw> // (D) SAVE & COMPRESS IMAGE // jpg : 0 to 100 // webp : -1 (default), 0 to 100 // png : -1 (default), 0 (none) to 9 // gif : na (no compression) if ($extTo=="gif") < imagegif($img, $to); >else < if ($extTo=="jpg" && ($quality==null || !is_numeric($quality) || $quality100)) < $quality = 30; >if ($extTo=="webp" && ($quality==null || !is_numeric($quality) || $quality100)) < $quality = -1; >if ($extTo=="png" && ($quality==null || !is_numeric($quality) || $quality9)) < $quality = -1; >$fn = "image" . ($extTo=="jpg" ? "jpeg" : $extTo); $fn($img, $to, $quality); > return true; > // (E) GO! packi("D:/http/demo.png", "D:/http/demoC.jpg"); packi("D:/http/demo.png", "D:/http/demoC.png", 200, 0); // max width 200 packi("D:/http/demo.png", "D:/http/demoC.gif", 0, 200); // max height 200 packi("D:/http/demo.png", "D:/http/demoC.webp", 200, 400); // max width 200, max height 400 echo "DONE";

  

  For you guys who just want “a function to compress images”, I got you covered. Just use packi(SOURCE IMAGE, SAVE TO, MAX WIDTH, MAX HEIGHT, QUALITY) .

  • SOURCE IMAGE The original image.
  • SAVE TO Save to this file, can be jpg webp png gif .
  • MAX WIDTH & MAX HEIGHT Optional, will resize the original image if it exceeds these settings.
  • QUALITY Save quality, optional.
    • JPG From 0 (lowest) to 100 (highest).
    • WEBP From 0 (lowest) to 100 (highest), -1 for default.
    • PNG From 0 (no compression) to 9, -1 for default.
    • GIF None. Cannot be compressed.

    DOWNLOAD & NOTES

    Here is the download link to the example code, so you don’t have to copy-paste everything.

    SUPPORT

    600+ free tutorials & projects on Code Boxx and still growing. I insist on not turning Code Boxx into a «paid scripts and courses» business, so every little bit of support helps.

    EXAMPLE CODE DOWNLOAD

    Click here for the source code on GitHub gist, just click on “download zip” or do a git clone. I have released it under the MIT license, so feel free to build on top of it or use it in your own project.

    EXTRA BITS & LINKS

    That’s all for this guide, and here is a small section on some extras and links that may be useful to you.

    THE TRANSPARENT BACKGROUND DISAPPEARED!?

    For the uninitiated – Only WEBP , PNG , and GIF supports a transparent background.

    COMPRESSION MAY NOT ALWAYS END WELL

    Take note of the screenshot in the last example, the PNG file actually ends up larger than the original. So to manage your expectation, changing the image dimensions/type/compression may not always end up with good results. But if it works 90% of the time, then it’s worth the effort to implement the compression.

    LAZY LOADING

    

    Lastly, a small extra for you guys who wants to “speed up loading”. Just set the images to lazy loading. That is, the images will only load as the user scrolls down, when the image is on the screen. Very easy, just add lazy to the image tag – .

    LINKS & REFERENCES

    • Lossy vs Lossless Compression – Kinsta
    • Lazy Loading – MDN
    • How To Resize Images In PHP – Code Boxx
    • How to Add Text to Images In PHP – Code Boxx
    • Simple Drag-and-drop File Upload With PHP – Code Boxx
    • GD Manual – PHP

    INFOGRAPHIC CHEAT SHEET

    

    THE END

    Thank you for reading, and we have come to the end of this guide. I hope that it has helped you with your project, and if you want to share anything with this guide, please feel free to comment below. Good luck and happy coding!

    Источник