{"id":29193,"date":"2021-06-09T15:44:00","date_gmt":"2021-06-09T12:44:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=29193"},"modified":"2021-10-18T03:36:04","modified_gmt":"2021-10-18T00:36:04","slug":"przeslij-i-skompresuj-wiele-obrazow-w-php","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/pl\/przeslij-i-skompresuj-wiele-obrazow-w-php\/","title":{"rendered":"Prze\u015blij i skompresuj wiele obraz\u00f3w w PHP"},"content":{"rendered":"

Ostatnio jeden z naszych czytelnik\u00f3w zapyta\u0142, jak przes\u0142a\u0107 i skompresowa\u0107 wiele obraz\u00f3w w PHP. Istniej\u0105 pewne scenariusze, w kt\u00f3rych musimy umo\u017cliwi\u0107 u\u017cytkownikom przesy\u0142anie wielu obraz\u00f3w. Dobr\u0105 praktyk\u0105 jest zawsze optymalizacja obraz\u00f3w podczas przesy\u0142ania. W tym artykule przyjrzymy si\u0119 przesy\u0142aniu wielu obraz\u00f3w i temu, jak kompresowa\u0107 obrazy podczas procesu przesy\u0142ania.<\/p>\n

Dlaczego musimy zmniejszy\u0107 rozmiar pliku obrazu?<\/h3>\n

Bez w\u0105tpienia obrazy odgrywaj\u0105 wa\u017cn\u0105 rol\u0119 w Twojej witrynie. Przyci\u0105gaj\u0105ce wzrok obrazy przyci\u0105gaj\u0105 uwag\u0119 czytelnik\u00f3w i sp\u0119dzaj\u0105 wi\u0119cej czasu na stronie. Ale jednocze\u015bnie du\u017ce obrazy spowalniaj\u0105 Twoj\u0105 witryn\u0119. Poniewa\u017c wymaga wi\u0119kszej przepustowo\u015bci, Twoja witryna zajmuje wi\u0119cej czasu, aby za\u0142adowa\u0107 strony internetowe. W\u0142a\u015bciciele witryn musz\u0105 zwraca\u0107 uwag\u0119, aby zmniejszy\u0107 rozmiar pliku obrazu i u\u017cy\u0107 do tego najlepszego narz\u0119dzia do kompresji obrazu.<\/p>\n

Poka\u017c\u0119 Ci 2 sposoby kompresji obraz\u00f3w \u2013 TinyPNG oraz pakiet artisansweb\/image-optimizer<\/a>.<\/p>\n

TinyPNG<\/a> to jedna z popularnych us\u0142ug kompresji obrazu w sieci. Ta us\u0142uga umo\u017cliwia bezp\u0142atn\u0105 kompresj\u0119 500 obraz\u00f3w miesi\u0119cznie za po\u015brednictwem ich interfejs\u00f3w API. Za wi\u0119cej ni\u017c 500 zdj\u0119\u0107 musisz im zap\u0142aci\u0107.<\/p>\n

Je\u015bli musisz zoptymalizowa\u0107 wi\u0119cej ni\u017c 500 zdj\u0119\u0107 miesi\u0119cznie i nie chcesz p\u0142aci\u0107, skorzystaj z pakietu \u201eartisansweb\/image-optimizer". Ten pakiet wykorzystuje us\u0142ug\u0119 reSmush.it<\/a> do optymalizacji obrazu.<\/p>\n

Polecam wypr\u00f3bowanie obu rozwi\u0105za\u0144, por\u00f3wnanie wynik\u00f3w i wybranie tego, kt\u00f3re jest dla Ciebie odpowiednie.<\/p>\n

Powiedziawszy to, przyjrzyjmy si\u0119, jak skompresowa\u0107 obrazy po ich przes\u0142aniu.<\/p>\n

Pierwsze kroki z TinyPNG<\/h3>\n

Aby rozpocz\u0105\u0107, musisz uzyska\u0107 klucz API od TinyPNG. Kliknij tutaj,<\/a> aby otrzyma\u0107 klucz API. Wystarczy wpisa\u0107 swoje imi\u0119 i nazwisko oraz adres e-mail, a otrzymasz e-mail z kluczem.<\/p>\n

\"Prze\u015blij<\/a><\/p>\n

Po otrzymaniu klucza programisty zainstaluj bibliotek\u0119 PHP dostarczon\u0105 przez TinyPNG. Aby zainstalowa\u0107 bibliotek\u0119, w systemie powinien by\u0107 zainstalowany Composer<\/a>. Otw\u00f3rz terminal w katalogu g\u0142\u00f3wnym projektu i uruchom polecenie:<\/p>\n

composer require tinify\/tinify<\/code><\/pre>\n
Jak kompresowa\u0107 obrazy za pomoc\u0105 TinyPNG<\/h3>\n
Jak wspomniano w tytule tego artyku\u0142u, zobaczymy, jak przes\u0142a\u0107 i skompresowa\u0107 wiele obraz\u00f3w. W tym celu musimy utworzy\u0107 formularz HTML, kt\u00f3ry zawiera plik wej\u015bciowy do przegl\u0105dania wielu obraz\u00f3w. Utw\u00f3rz index.php<\/code>i umie\u015b\u0107 w nim poni\u017cszy kod.<\/p>\n
index.php<\/strong><\/p>\n
<form method=\"post\" enctype=\"multipart\/form-data\" action=\"process_images.php\">\n\u00a0\u00a0\u00a0\u00a0<p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label>Upload Images<\/label>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input type=\"file\" name=\"images[]\" accept=\"image\/*\" multiple>\n\u00a0\u00a0\u00a0\u00a0<\/p>\n\u00a0\u00a0\u00a0\u00a0<button type=\"submit\" name=\"submit\">Submit<\/button>\n<\/form><\/code><\/pre>\n
Do pliku wej\u015bciowego nada\u0142em nazw\u0119 jako images[]. Dzieje si\u0119 tak, poniewa\u017c po stronie serwera potrzebujemy tablicy plik\u00f3w, poniewa\u017c u\u017cytkownik b\u0119dzie przegl\u0105da\u0142 wiele obraz\u00f3w.<\/p>\n
Po przejrzeniu zdj\u0119\u0107 i naci\u015bni\u0119ciu przycisku przesy\u0142ania dane formularza zostan\u0105 przes\u0142ane do pliku process_images.php<\/code>. Jest to plik, w kt\u00f3rym musimy napisa\u0107 kod do przesy\u0142ania i kompresji obraz\u00f3w.<\/p>\n
process_images.php<\/strong><\/p>\n
<?php\n\/\/ Increase PHP execution time\nset_time_limit(0);\n\u00a0\nrequire_once(\"vendor\/autoload.php\");\nTinifysetKey(\"YOUR_API_KEY\");\n\u00a0\nif (isset($_POST['submit'])) {\n\u00a0\u00a0\u00a0\u00a0$supported_images = array('image\/gif', 'image\/jpg', 'image\/jpeg', 'image\/png');\n\u00a0\n\u00a0\u00a0\u00a0\u00a0if (!file_exists(getcwd(). '\/uploads')) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0mkdir(getcwd(). '\/uploads', 0777);\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0foreach($_FILES['images']['name'] as $key=>$val) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$file_name = $_FILES['images']['name'][$key];\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get file extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$ext = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get filename without extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenamewithoutextension = pathinfo($file_name, PATHINFO_FILENAME);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (in_array($_FILES['images']['type'][$key], $supported_images)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filename_to_store = $filenamewithoutextension.'_'.time().'.' .$ext;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0move_uploaded_file($_FILES['images']['tmp_name'][$key], getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ optimize image using TinyPNG\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0try {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$source = TinifyfromFile(getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$source->toFile(getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} catch(Exception $e) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo $e->getMessage();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0exit;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0echo \"Files uploaded successfully.\";\n}<\/code><\/pre>\n
Pami\u0119taj, aby zast\u0105pi\u0107 symbol zast\u0119pczy rzeczywistym kluczem API. W powy\u017cszym kodzie generujemy unikaln\u0105 nazw\u0119 pliku dodaj\u0105c do niej czas. Po przes\u0142aniu obrazu na serwer wysy\u0142amy obraz do API TinyPNG w celu optymalizacji. W zamian otrzymujemy skompresowan\u0105 wersj\u0119 obrazu, kt\u00f3ry przechowujemy w tym samym miejscu i pod t\u0105 sam\u0105 nazw\u0105 pliku.<\/p>\n
Kompresuj obrazy za pomoc\u0105 pakietu artisansweb\/image-optimizer<\/h3>\n
Opracowa\u0142em pakiet Image Optimizer<\/a>. Ten pakiet wykorzystuje us\u0142ug\u0119 reSmush.it<\/a> pod mask\u0105 do optymalizacji obraz\u00f3w. Je\u015bli szukasz bezp\u0142atnej us\u0142ugi, wypr\u00f3buj ten pakiet. ReSmush.it do tej pory zoptymalizowa\u0142 miliardy obraz\u00f3w. Ten pakiet nie wymaga podawania \u017cadnego klucza ani rejestracji. Po prostu pod\u0142\u0105cz i gotowe.<\/p>\n
Aby rozpocz\u0105\u0107 korzystanie z pakietu Image Optimizer, zainstaluj go za pomoc\u0105 polecenia:<\/p>\n
composer require artisansweb\/image-optimizer<\/code><\/pre>\n
Nast\u0119pnie kod w process_image.php<\/code>zostanie zmodyfikowany w nast\u0119puj\u0105cy spos\u00f3b.<\/p>\n
<?php\n\/\/ Increase PHP execution time\nset_time_limit(0);\n\u00a0\nrequire_once(\"vendor\/autoload.php\");\n\u00a0\nuse ArtisansWebOptimizer;\n\u00a0\nif (isset($_POST['submit'])) {\n\u00a0\u00a0\u00a0\u00a0$supported_images = array('image\/gif', 'image\/jpg', 'image\/jpeg', 'image\/png');\n\u00a0\n\u00a0\u00a0\u00a0\u00a0if (!file_exists(getcwd(). '\/uploads')) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0mkdir(getcwd(). '\/uploads', 0777);\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0foreach($_FILES['images']['name'] as $key=>$val) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$file_name = $_FILES['images']['name'][$key];\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get file extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$ext = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get filename without extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenamewithoutextension = pathinfo($file_name, PATHINFO_FILENAME);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (in_array($_FILES['images']['type'][$key], $supported_images)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filename_to_store = $filenamewithoutextension.'_'.time().'.' .$ext;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0move_uploaded_file($_FILES['images']['tmp_name'][$key], getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ optimize image\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0try {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$img = new Optimizer();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$source = getcwd().'\/uploads\/'.$filename_to_store;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$img->optimize($source);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} catch(Exception $e) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo $e->getMessage();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0exit;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0echo \"Files uploaded successfully.\";\n}<\/code><\/pre>\n
Mam nadziej\u0119, \u017ce rozumiesz, jak przesy\u0142a\u0107 i kompresowa\u0107 wiele obraz\u00f3w w PHP. Chcia\u0142bym us\u0142ysze\u0107 wasze przemy\u015blenia i sugestie w sekcji komentarzy poni\u017cej.<\/p>\n
Powi\u0105zane artyku\u0142y<\/h4>\n