Php knižnica pre prácu s obrázkami. Kompletný sprievodca nahrávaním obrázkov v PHP. I) Tvorba plátna

  • 03.11.2019

V tomto článku budeme podrobne analyzovať mechanizmus nahrávania obrázkov na server pomocou PHP bez použitia komponentov a rámcov tretích strán. Dozvieme sa, ako bezpečne sťahovať obrázky nielen z lokálneho počítača používateľa, ale aj vzdialené súbory prostredníctvom odkazu. Všetky príklady kódu napíšem procedurálnym štýlom, aby ste si kód prečítali rýchlejšie a nepreskakovali z jednej metódy na druhú. Manuál je plne chránený autorskými právami a žiadnym spôsobom nepredstiera, že je akademický.

§1. Všeobecné zásady

Celá sekvencia nahrávania obrázka na server sa môže zobraziť takto: nastavenie php.inizískať súborBezpečnostná kontrolaoverovanie dátuložiť na disk... Proces sťahovania obrázka z počítača používateľa alebo z adresy URL nie je odlišný, výnimkou je spôsob získania obrázka a jeho uloženia. Všeobecná schéma nahrávania obrázka na server je nasledovná:

Na overenie obrázka podľa adresy URL použijeme funkciu getimagesizefromstring (), pretože cURL ho stiahne do premennej na ďalšie manipulácie.

Keďže obrázky nahrávame na server, bolo by pekné skontrolovať ich špecifické parametre: šírka, výška, Typ obrázky, veľkosť súbor v bajtoch. Závisí to od logiky vašej aplikácie, ale kvôli prehľadnosti v tomto návode skontrolujeme všetky parametre popísané vyššie.

§2. Bezpečnostné predpisy

Bezpečnosť sťahovania obrázkov spočíva v zabránení vstupu cudzieho kódu na server a jeho spusteniu. V praxi je načítanie obrázkov najzraniteľnejším miestom v aplikáciách PHP: shell skripty hit, zapisovanie škodlivého kódu do binárnych súborov, nahradenie EXIF ​​údajov... Aby ste sa vyhli väčšine metód hackovania, musíte dodržiavať nasledujúce pravidlá:

a nie dôverovať údajom z $ _FILES;
b nie skontrolujte typ MIME obrázka pomocou funkcie getimagesize ();
vygenerovať nový názov a príponu v načítanom súbore;
d zakázať vykonávanie PHP skriptov v priečinku s obrázkami;
d nie vložiť vlastné údaje cez vyžadovať a zahrnúť;
To znamená, že pre $ _FILES použite is_uploaded_file () a move_uploaded_file ().

Ak máte niečo na doplnenie "Bezpečnostných pravidiel", potom zanechajte svoje pripomienky alebo odkazy na články o bezpečnosti v komentároch k tomuto návodu a ja ich zverejním v tomto odseku.

§3. konfigurácia PHP.ini

PHP vám umožňuje pridať určité konfiguračné hodnoty do procesu nahrávania akýchkoľvek súborov. Ak to chcete urobiť, musíte nájsť bloky v súbore php.ini “ Limity zdrojov», « Manipulácia s údajmi" a " Nahrávanie súborov"A potom podľa potreby upravte nasledujúce hodnoty:

; Maximálny čas vykonania skriptu v sekundách max_execution_time = 60 ; Maximálna spotreba pamäte jedným skriptom memory_limit = 64 miliónov ; Maximálna povolená veľkosť údajov odoslaných metódou POST post_max_size = 5 miliónov ; Povolenie na nahrávanie súboru file_uploads = Zapnuté ; Priečinok na ukladanie súborov počas nahrávania upload_tmp_dir = domov / používateľ / dočasný ; Maximálna veľkosť nahrávaného súboru upload_max_filesize = 5 miliónov ; Maximálny povolený počet súčasne odovzdaných súborov max_file_uploads = 10

Na základe zadaných hodnôt si používateľ nebude môcť naraz stiahnuť viac ako desať súborov a každý súbor by nemal presiahnuť 5 MB. Parametre z bloku " Limity zdrojov„Sú potrebnejšie na načítanie vzdialeného súboru, pretože pomocou cURL stiahneme obsah do premennej a skontrolujeme ho podľa kritérií, ktoré potrebujeme, a to si vyžaduje dodatočný čas a pamäť.

Konfiguračný súbor php.ini musí byť vždy nakonfigurovaný podľa obchodnej logiky vyvíjanej webovej aplikácie. Napríklad plánujeme odovzdať maximálne desať súborov do 5 MB, čo znamená, že potrebujeme ~ 50 MB pamäte. Okrem toho potrebujeme poznať maximálny čas sťahovania jedného súboru z lokálneho počítača a odkazom, aby sme nastavili dostatočný čas spustenia skriptu v max_execution_time a nevystrašili používateľov chybami.

§4. Načítavanie obrázkov z formulára

Teraz nebudeme uvažovať o nahrávaní niekoľkých súborov na server, ale analyzujeme len samotnú mechaniku nahrávania na príklade jedného súboru. Ak chcete nahrať obrázok z počítača používateľa, musíte odoslať súbor do skriptu PHP pomocou metódy POST pomocou formulára HTML a zadať metódu kódovania údajov. enctype = "multipart / form-data"(v tomto prípade dáta nie sú zakódované a táto hodnota sa používa len na odosielanie binárnych súborov). Budeme pracovať s nižšie uvedeným formulárom:

Pre pole na výber súboru používame názov name = "nahrať" v našej HTML forme, hoci to môže byť čokoľvek. Po odoslaní súboru do PHP skriptu file-handler.php je možné ho zachytiť pomocou premennej superglobal $ _FILES ["nahrať"] s rovnakým názvom, ktorý v poli obsahuje informácie o súbore:

Pole ( => obrázok.jpg // pôvodný názov súboru => obrázok / jpeg // typ súboru MIME => home \ user \ temp \ phpD07E.tmp // binárny súbor => 0 // kód chyby => 17170 // veľkosť súboru v bajtoch)

Nie všetky údaje z $ _FILES Môžete dôverovať: Typ MIME a veľkosť súboru môžu byť sfalšované, pretože sú vytvorené z odpovede HTTP a prípone v názve súboru by sa nemalo dôverovať, pretože sa za ňou môže skrývať úplne iný súbor. . Ďalej však musíme skontrolovať, či sa náš súbor načítal správne a či sa vôbec načítal. Ak to chcete urobiť, musíte skontrolovať chyby v $ _FILES ["nahrať"] ["chyba"] a uistite sa, že súbor je nahraný pomocou metódy POST pomocou funkcie is_uploaded_file ()... Ak niečo nejde podľa plánu, zobrazíme chybu na obrazovke.

// Pre pohodlie prepíšte premenné$ filePath = $ _FILES ["nahrať"] ["tmp_name"]; $ errorCode = $ _FILES ["nahrať"] ["chyba"]; // Kontrola chýb if ($ errorCode! == UPLOAD_ERR_OK ||! is_uploaded_file ($ filePath)) ( // Pole s názvami chýb$ errorMessages = [UPLOAD_ERR_INI_SIZE => "Veľkosť súboru prekročila upload_max_filesize v konfigurácii PHP.", UPLOAD_ERR_FORM_SIZE => "Veľkosť odovzdaného súboru prekročila hodnotu MAX_FILE_SIZE vo formáte HTML.", UPLOAD_ERR_PARTIAL => "Súbor na stiahnutie bol prijatý iba čiastočne.", UPLOAD_ERR_NO_FILE => "Súbor sa nenačítal.", UPLOAD_ERR_NO_TMP_DIR => "Dočasný priečinok chýba.", UPLOAD_ERR_CANT_WRITE => "Nepodarilo sa zapísať súbor na disk.", UPLOAD_ERR_EXTENSION => "Rozšírenie PHP zastavilo sťahovanie súboru.", ]; // Nastavenie neznámej chyby$ neznámaSpráva = "Pri sťahovaní súboru sa vyskytla neznáma chyba."; // Ak v poli nie je žiadny kód chyby, povedzme, že chyba je neznáma$ outputMessage = isset ($ errorMessages [$ errorCode])? $ errorMessages [$ errorCode]: $ neznáma správa; // Zobrazenie názvu chyby zomrieť ($ outputMessage); )

Funkcii nemožno dôverovať, aby sa zabránilo stiahnutiu škodlivého kódu vloženého do obrázka útočníkom getimagesize () ktorý tiež vráti typ MIME. Funkcia očakáva, že prvým argumentom bude odkaz na platný súbor obrázka... Pomocou rozšírenia FileInfo môžete určiť skutočný typ MIME obrázka. Nižšie uvedený kód skontroluje prítomnosť kľúčového slova obrázok v type nášho nahraného súboru a ak sa nezobrazí, zobrazí chybu:

// Vytvorenie zdroja FileInfo$ fi = finfo_open (FILEINFO_MIME_TYPE); // Získanie typu MIME $ mime = (string) finfo_file ($ fi, $ cesta k súboru); );

V tejto fáze už môžeme na náš server nahrať absolútne ľubovoľné obrázky, ktoré prešli kontrolou typu MIME, ale na nahrávanie obrázkov podľa určitých charakteristík ich musíme overiť pomocou funkcie getimagesize (), ktorým budeme kŕmiť samotný binárny súbor $ _FILES ["nahrať"] ["tmp_name"]... V dôsledku toho dostaneme pole s maximálne 7 prvkami:

Pole (=> 1280 // šírka => 768 // výška => 2 // typ => šírka = "1280" výška = "768" // atribúty pre HTML => 8 // farebná hĺbka => 3 // farebný model => obrázok / jpeg // typ MIME)

Na ďalšie overenie obrázka a prácu na ňom potrebujeme poznať iba 3 hodnoty: šírka, výška a veľkosť súbor (na výpočet veľkosti použite funkciu veľkosť súboru () pre binárny súbor z dočasného priečinka).

// Výsledok funkcie zapíšeme do premennej$ image = getimagesize ($ filePath); $ limitBytes = 1024 * 1024 * 5; $ limitWidth = 1280; $ limitHeight = 768; // Skontrolujte požadované parametre if (veľkosť súboru ($ filePath)> $ limitBytes) zomrieť ( "Veľkosť obrázka nesmie presiahnuť 5 MB."); if ($ image> $ limitHeight) die (); if ($ image> $ limitWidth) die ();

Po všetkých kontrolách môžeme s istotou presunúť náš súbor na stiahnutie do nejakého priečinka s obrázkami. Je lepšie to urobiť prostredníctvom funkcie move_uploaded_file () ktorý beží v núdzovom režime. Pred presunom súboru nesmiete zabudnúť vygenerovať náhodný názov a príponu z typu obrázka pre náš súbor. Takto to vyzerá:

// Vygeneruje nový názov súboru na základe hashu MD5$ meno = md5_file ($ filePath); // Zmenšiť .jpeg na .jpg// Presuňte obrázok s novým názvom a príponou do priečinka / pics if (! move_uploaded_file ($ filePath, __DIR__. "/ pics /". $ name. $ format)) (die ( "Pri zapisovaní obrazu na disk sa vyskytla chyba."); }

Tým sa dokončí načítanie obrázka. Pre pohodlnejšie nahrávanie súborov môžete použiť triedu UploadedFile z balíka Symfony HttpFoundation, čo je obal pre $ _FILES a tiež uloží súbor cez move_uploaded_file ().

§5. Nahrávanie obrázka z odkazu

Na načítanie obrázka z odkazu potrebujeme knižnicu cURL, ktorá pracuje so vzdialenými zdrojmi. Pomocou nej stiahneme obsah do premennej. Na jednej strane sa môže zdať, že na tieto účely je vhodný file_get_contents (), ale v skutočnosti nebudeme môcť kontrolovať množstvo stiahnutých dát a normálne zvládnuť všetky chyby, ktoré sa vyskytnú. Aby cURL správne stiahol dáta, musíme: povoliť sledovanie presmerovania, povoliť kontrolu certifikát, uveďte maximálny čas cURL práca (vytvorená v dôsledku množstva stiahnutých údajov a priemernej rýchlosti práce so zdrojom). Ako správne stiahnuť súbor do premennej je uvedený nižšie s potrebnými parametrami:

// Získať odkaz nejako$ url = "https://site.ru/picture.jpg"; // Skontrolujte HTTP v adrese URL odkazu if (! preg_match ("/ ^ https?: / i", $ url) && filter_var ($ url, FILTER_VALIDATE_URL)) (die ( "Uveďte platný odkaz na vzdialený súbor."); } // Spustite cURL s naším odkazom$ ch = curl_init ($ url); // Zadajte nastavenia pre cURL curl_setopt_array ($ ch, [ // Zadajte maximálny čas chodu pre cURL CURLOPT_TIMEOUT => 60, // Povoliť sledovanie presmerovaní CURLOPT_FOLLOWLOCATION => 1, // Dovoľme zapísať výsledok do premennej CURLOPT_RETURNTRANSFER => 1, // Zapnite indikátor načítania dát CURLOPT_NOPROGRESS => 0, // Nastavte veľkosť vyrovnávacej pamäte na 1 KB CURLOPT_BUFFERSIZE => 1024, // Napíšte funkciu na počítanie stiahnutých dát // Viac podrobností: http://stackoverflow.com/a/17642638 CURLOPT_PROGRESSFUNCTION => funkcia ($ ch, $ dwnldSize, $ dwnld, $ upldSize, $ upld) ( // Keď sa stiahne viac ako 5 MB, cURL sa preruší if ($ dwnld> 1024 * 1024 * 5) (návrat - 1;)), // Zapnúť overenie certifikátu (predvolene) CURLOPT_SSL_VERIFYPEER => 1, // Skontrolujte názov certifikátu a jeho zhodu so zadaným hostiteľom (v predvolenom nastavení) CURLOPT_SSL_VERIFYHOST => 2, // Zadajte overovací certifikát // Na stiahnutie: https://curl.haxx.se/docs/caextract.html CURLOPT_CAINFO => __DIR__. "/cacert.pem",]); $ raw = curl_exec ($ ch); // Načítanie údajov do premennej$ info = curl_getinfo ($ ch); // Získanie informácií o operácii$ error = curl_errno ($ ch); // Napíšte kód poslednej chyby // Ukončite reláciu cURL curl_close ($ ch);

Ak všetko prebehlo dobre a cURL skončilo do 60 sekúnd, obsah odkazu sa stiahne do premennej $ surové... Okrem toho funkcia curl_getinfo () vráti informácie o vykonanej požiadavke, odkiaľ môžeme získať ďalšie informácie na analýzu práce so vzdialenými zdrojmi:

Pole ( => obrázok / jpeg // MIME typ z Content-Type => 200 // posledný HTTP kód => 0 // počet presmerovaní => 0.656 // celkový čas chodu cURL => 0.188 // čas na pripojenie k hostiteľovi => 4504 // skutočná veľkosť prijímaných dát => 4504 // veľkosť údajov z Content-Length /* ... */ )

Ďalej musíme skontrolovať, či v ňom nie sú nejaké chyby curl_errno () a uistite sa, že zdroj vracia kód HTTP rovný 200, inak povieme, že na tejto adrese URL sa nič nenašlo. Po všetkých kontrolách premenná $ surové preniesť na getimagesizefromstring () a pracujeme podľa zavedenej schémy, ako v prípade načítania obrázkov z formulára.

Upozorňujeme, že overujeme veľkosť súboru v čase prijímania údajov, pretože nemôžeme 100% dôverovať curl_getinfo (), pretože hodnoty content_type, http_code, download_content_length sa generujú na základe prijatých hlavičiek HTTP. Stiahnutie celého súboru a následná kontrola počtu bajtov zaberie veľa času a pamäte. Preto sme kontrolovali veľkosť prijímaných dát pomocou možnosti CURLOPT_PROGRESSFUNCTION: akonáhle cURL dostane viac dát ako je náš limit, prestane fungovať a vyvolá chybu CURLE_ABORTED_BY_CALLBACK.

// Skontrolujte chyby cURL a dostupnosť súboru if ($ chyba === CURLE_OPERATION_TIMEDOUT) zomrieť ( "Prekročený limit čakania."); if ($ chyba === CURLE_ABORTED_BY_CALLBACK) zomrieť ( "Veľkosť by nemala presiahnuť 5 MB."); if ($ info ["http_code"]! == 200) zomrieť ( "Súbor nie je k dispozícii."); // Vytvorenie zdroja FileInfo$ fi = finfo_open (FILEINFO_MIME_TYPE); // Získanie typu MIME pomocou obsahu $ raw$ mime = (reťazec) finfo_buffer ($ fi, $ raw); // Zatvorte zdroj FileInfo finfo_close ($ fi); // Skontrolujte obrázok kľúčového slova (obrázok / jpeg, obrázok / png atď.) if (strpos ($ mime, "image") === false) die ( "Je možné nahrať iba obrázky."); // Prevezmite obrazové údaje z jeho obsahu$ image = getimagesizefromstring ($ raw); // Nastavenie limitov pre obrázky$ limitWidth = 1280; $ limitHeight = 768; // Skontrolujte požadované parametre if ($ image> $ limitHeight) zomrieť ( "Výška obrázka by nemala presiahnuť 768 pixelov."); if ($ image> $ limitWidth) zomrieť ( "Šírka obrázka nesmie presiahnuť 1280 bodov."); // Vygenerujte nový názov z MD5 hash obrázku$ name = md5 ($ raw); // Vygenerujte príponu súboru na základe typu obrázka$ extension = image_type_to_extension ($ image); // Zmenšiť .jpeg na .jpg$ format = str_replace ("jpeg", "jpg", $ rozšírenie); // Uložte obrázok s novým názvom a príponou do priečinka / pics if (! file_put_contents (__DIR__. "/ pics /". $ name. $ format, $ raw)) (die ( "Pri ukladaní obrazu na disk sa vyskytla chyba."); }

Ak chcete uložiť obrázok na disk, môžete použiť file_put_contents () ktorý zapíše obsah do súboru. Prostredníctvom funkcie vytvoríme nový názov súboru md5 (), a predĺženie urobíme z image_type_to_extension ()... Teraz si môžeme stiahnuť ľubovoľné obrázky z odkazu.

§6. Konfigurácia výberu viacerých súborov

V tejto časti budeme analyzovať, ako stiahnuť niekoľko obrázkov naraz z lokálneho počítača používateľa a zo vzdialených odkazov. Na odosielanie odkazov používame $ _POST a odovzdať mu všetky údaje pomocou značky textarea... Na načítanie súborov z formulára budeme ďalej pracovať $ _FILES... Náš nový HTML formulár sa bude mierne líšiť od starého.

Na konci názvu poľa výberu súboru name = "nahrať" pridané kučeravé zátvorky a atribút viacnásobnýčo umožňuje prehliadaču vybrať viacero súborov. Všetky súbory sa znova nahrajú do dočasného priečinka, ak v php.ini nie sú žiadne chyby. Môžete ich zachytiť $ _FILES, ale tentoraz bude mať superglobálna nepohodlnú štruktúru na spracovanie údajov v poli. Tento problém je vyriešený malými manipuláciami s poľom:

// Zmena štruktúry $ _FILES foreach ($ _FILES ["nahrať"] ako kľúč $ => hodnota $) (foreach (hodnota $ ako $ k => $ v) ($ _FILES ["nahrať"] [$ k] [kľúč $] = $ v; ) // Odstrániť staré kľúče zrušiť nastavenie ($ _FILES ["nahrať"] [kľúč $]); ) // Načítajte všetky obrázky v poradí foreach ($ _FILES ["nahrať"] ako $ k => $ v) ( // Načítavanie súborov po jednom$ _FILES ["nahrať"] [$ k] ["tmp_name"]; $ _FILES ["nahrať"] [$ k] ["chyba"]; )

Ak chcete stiahnuť niekoľko obrázkov podľa adresy URL, prepošleme naše odkazy textarea S menom name = "nahrať", kde ich môžete zadať oddelené medzerou alebo na nový riadok. Funkcia preg_split analyzuje všetky údaje z $ _POST ["nahrať"] a vytvorí pole, cez ktoré musíte prejsť a odoslať každú platnú adresu URL obslužnému programu.

$ data = preg_split ("/ \ s + /", $ _POST ["nahrať"], - 1, PREG_SPLIT_NO_EMPTY); foreach ($ údaje ako $ url) ( // Overte a načítajte obrázok podľa adresy URL }

Ak ste vášnivým vývojárom PHP, pravdepodobne ste už nepočuli len o knižnici GD. Pre tých, ktorí to nepoznajú, vysvetlím, že knižnica GD vám umožňuje vytvárať obrázky, upravovať ich a spravovať ich bez veľkého úsilia. Dnes sa zoznámime so základmi používania knižnice GD v PHP.

Po prvé

Uistite sa, že knižnica GD je nainštalovaná a aktivovaná na vašom serveri. Neviete, ako to urobiť? Nebojte sa, je to jednoduché! Potrebujete iba vytvoriť súbor PHP na serveri a potom zadať nasledovné:

Teraz otvorte stránku prehliadača a uvidíte obrovský zoznam funkcií vašej verzie PHP. Posuňte stránku trochu nadol, nájdite sekciu „GD“ a uistite sa, že je knižnica pripojená. Ak nie, kontaktujte svoju hostingovú spoločnosť. Našťastie na väčšine serverov, na ktorých som už pracoval a pracujem, je knižnica GD nainštalovaná a pripojená.

Základné momenty

Poďme sa pozrieť na niektoré najdôležitejšie. Najprv sa ubezpečíme, že všetky chybové hlásenia vydáva prehliadač. To sa dá dosiahnuť zadaním nasledujúceho na úplnom začiatku vášho php kódu:

chybové hlásenie (E_ALL);
?>

Nakreslíme štvorec

Začnime tým najjednoduchším a nakreslite modrý štvorec pomocou PHP - nič nadprirodzené, samozrejme, ale musíte zistiť základy. Ak chcete získať požadovaný štvorec, musíte urobiť nasledovné:

Nastavte typ obsahu na „obrázok“, aby prehliadač mohol obrázok správne interpretovať;
... Vytvorte nový prázdny obrázok nastavením požadovanej šírky a výšky;
... Zmeňte farbu pozadia na modrú;
... Uložte konečnú verziu obrázka a preneste ju do prehliadača;
... Vymažte pamäť, ktorá bola použitá na vytvorenie a uloženie obrázka;
... Usporiadajte zobrazenie obrázkov zo súboru index.php

Teraz, keď sme sa rozhodli pre poradie akcií, môžeme začať kódovať. Snažil som sa komentovať každý riadok kódu a o funkciách použitých v procese kódovania vám poviem neskôr. Takže tu je kód na vytvorenie nášho modrého štvorca. Po napísaní si ho uložíme pod názvom 'basic_square.php'.

// Nastavenie zobrazovania chybových hlásení
ini_set ("display_errors", "1");
chybové hlásenie (E_ALL);


// Určenie veľkosti obrázka
// 125px šírka, 125px výška
$ image = imagecreate (125, 125);

// Vyberte farbu pozadia
$ blue = imagecolorallocate ($ image, 0, 0, 255);

// Nastavte inú farbu - len aby ste sa uistili, že keď sa obrázok zobrazí, farba pozadia bude presne tá, ktorá bola nastavená ako prvá ()
// Všimnite si, že štvorec bude modrý, nie červený.
$ red = imagecolorallocate ($ image, 255, 0, 0);

// Uložte súbor vo formáte png a vypíšte ho
imagepng ($ obrázok);

// Vyčistite použitú pamäť
imagedestroy ($ image);
?>

Teraz sa pozrime na všetky použité funkcie a každý krok vyššie uvedeného kódu, aby sme lepšie pochopili, čo presne v ňom robíme:

Ako som už vysvetlil, pridávame možnosť nahlásiť chyby, aby sme ich v prípade potreby rýchlo opravili.
... Potom pomocou funkcie header () nastavíme typ obsahu na png
... Uložte obrázok a nastavte požadovanú šírku a výšku - podrobnosti nájdete v časti imagecreate ().
... Potom pomocou funkcie imagecolorallocate vyberieme modrú farbu pozadia nášho obrázka. Upozorňujeme, že konečná verzia najskôr zobrazí sadu farieb, takže náš štvorec bude modrý, nie červený.
... Na uloženie konečného obrázka používame imagepng (). Ak chcete uložiť výkres do adresára, musíte zadať ďalšie parametre.
... Nakoniec vyčistíme pamäť pomocou funkcie imagedestroy ().

Štvorec, ktorý sme nakreslili, si môžeme pozrieť otvorením súboru blue_square.php, alebo ešte lepšie, ak si naň odkážeme na hlavnej stránke:

Ak bolo všetko vykonané správne, uvidíte modrý štvorec, ako je tento:

Ahoj svet

Teraz, keď sme sa naučili vytvárať obrázky, skúsme vytvoriť obrázok s textom napísaným písmom podľa vlastného výberu. Môžeme použiť ľubovoľný font z adresára TrueType Font (.tff). V nasledujúcich príkladoch budem používať písmo „Advent“. Na tmavosivý štvorec napíšeme „Ahoj svet“. Pozor, pozrieme sa na kód a potom podrobne analyzujeme každý krok.

ini_set ("display_errors", "1");
chybové hlásenie (E_ALL);


hlavička ("typ obsahu: obrázok / png");

// Určenie veľkosti obrázku - 300x300 pixelov

// Nastavte farbu pozadia na tmavosivú

// Zadajte cestu k písmu
$ font_path = "advent_light";

// Napíšte text
$ string = "Ahoj Svet!";

// Skombinujte text a obrázok
imagettftext ($ obrázok, 50, 0, 10, 160, $ biela, $ cesta k písmu, $ reťazec);

// Uložte obrázok
imagepng ($ obrázok);

// Vyčistite pamäť
imagedestroy ($ image);
?>

Uložme kód do súboru ‚hello_world.php‘ a otvorme ho rovnakým spôsobom ako vyššie. Čo je tu teda nové?

Veľkosť obrázka sme nastavili na 300 * 300 pixelov a použili sme tmavosivé pozadie.
... Všimnite si, ako sme určili cestu k písmu pomocou názvu písma: ide o to, že neskôr v kóde budeme musieť prekryť text na obrázku. Pamätajte tiež, že názov písma sa píše bez prípony. Záleží však na tom, ktorú verziu knižnice GD PHP používa: ak názov fontu nezačína na '/', potom bude vyžadovaná prípona ttf - teda ak pred názvom nášho súboru fontu nie je /, potom sa na koniec automaticky pridá ttf ...
... Potom napíšeme "Ahoj svet!" a uložte text pre budúce použitie
... Najdôležitejšou funkciou použitou v tomto kóde je imagettftext (), ktorá vyžaduje 8 parametrov: cesta k obrázku, veľkosť obrázka, uhol sklonu, os x, os y, farba, písmo, text (v tomto poradí)

Uložte kód, otvorte ho akýmkoľvek spôsobom a uvidíte tento obrázok:

Hlasnejšie!

Všimli ste si, že funkcia imagettftext, ktorá spája text a obrázok, má možnosť umiestniť pod uhlom "? Takže môžeme náš text otáčať v akomkoľvek uhle. Prepíšme kód a otočme riadok na štvorci.

// Nastavenie chybových hlásení
ini_set ("display_errors", "1");
chybové hlásenie (E_ALL);

// Nastavte typ obsahu
hlavička ("typ obsahu: obrázok / png");

// Určite veľkosť obrázka: 300x300 pixelov
$ image = imagecreate (300, 300);

// Nastavte farbu pozadia - tmavosivá
$ dark_grey = imagecolorallocate ($ image, 102, 102, 102);
$ biela = imagecolorallocate ($ image, 255, 255, 255);

// Zadajte cestu k písmu
$ font_path = "advent_light";

// Napíšte text
$ string = "Ahoj Svet!";

// Skombinujte text a obrázok
imagettftext ($ obrázok, 50, -45, 30, 70, $ biela, $ font_path, $ reťazec);

// Uložte obrázok
imagepng ($ obrázok);

// Vyčistite pamäť
imagedestroy ($ image);
?>

Všimnite si, že sme nastavili hodnotu na -45 stupňov namiesto 0 stupňov (ako v predchádzajúcom príklade) - to je všetko, čo je potrebné na otočenie textu. Pozri sa na obrázok.

Ako to je? zaujímavé? nie? Potom skúsme niečo praktickejšie.

Aký je dnes dátum?

Obrázky môžeme nielen kresliť sami, ale použiť aj hotové! Trochu kódovania a budeme mať kalendár zobrazujúci aktuálny dátum (mesiac, deň a rok). Keď v Google hľadáme šablónu pre kalendár, nájdeme obrázok vo formáte .svg – zmenil som jeho veľkosť a previedol som ho do formátu png. Pozrite sa na prázdne miesto:

Teraz máme základ a môžeme ho zvládnuť pomocou funkcií GD a PHP. Upozorňujem vás, že netvrdím, že som najväčší svetový dizajnér – možno by stránka vyzerala lepšie s inou šablónou a iným písmom. Takže dizajn je váš, teraz sa pozrime na kód:

// Nastavenie chybových hlásení
ini_set ("display_errors", "1");
chybové hlásenie (E_ALL);

// Nastavte typ obsahu

// Uložiť dátum
zoznam ($ mesiac, $ deň, $ rok) = rozložiť ("/", dátum ("F / jS / Y"));

// Načítajte obrázok na pozadí
$ image = imagecreatefrompng ("calendar_blank.png");
$ šírka_obrázka = obrázkyx (obrázok $);

// Určenie farby pozadia a písma
$ biela = imagecolorallocate ($ image, 255, 255, 255);
$ black = imagecolorallocate ($ image, 0, 0, 0);
$ font_path = "advent_light";

// Zadajte polohu textu
$ pos_month = imagettfbbox (13, 0, $ font_path, $ mesiac);
$ pos_day = imagettfbbox (25, 0, $ font_path, $ deň);
$ pos_year = imagettfbbox (8, 0, $ font_path, $ rok);

// Napíšte mesiac
imagettftext ($ image, 13, 0, ($ image_width - $ pos_month) / 2, 40, $ white, $ font_path, $ month);

// Napíšte deň
imagettftext ($ image, 25, 0, ($ image_width - $ pos_day) / 2, 80, $ black, $ font_path, $ day);

// Napíšte rok
imagettftext ($ image, 8, 0, ($ image_width - $ pos_year) / 2, 100, $ black, $ font_path, $ year);

// Uložte obrázok
imagejpeg (obrázok $, "", 100);

// Vyčistite pamäť
imagedestroy ($ image);
?>

Tak čo tu robíme? Čo je funkcia zoznamu ()? Poďme na to:

Ako vždy nastavíme typ obsahu tak, aby sa obrázok zobrazil správne.
... Na 10. riadku vidíte funkciu zoznamu. Formát dátumu definujeme pomocou funkcie explode () a uložíme ho. Týmto spôsobom môžete usporiadať akékoľvek informácie. Teraz máme prístup k informáciám o aktuálnom mesiaci, dni a roku.
... V riadkoch 22-24 používame imagettfbbox () na usporiadanie formátu dátumu. Funkcia zaistí, že sa dátum zobrazí v zadanom poradí a do pravého dolného rohu napíšeme $ pos_month. To všetko je potrebné na to, aby bol text automaticky správne umiestnený bez ohľadu na jeho veľkosť.
... Potom postupne vytvoríme každý riadok a nastavíme x-veľkosť textu.

Ak by nedošlo k žiadnym katastrofám, mali by ste dostať obrázok nižšie, s jediným rozdielom, že dátum bude ten, ktorý je nainštalovaný vo vašom počítači - môj výkres, ako by ste mohli hádať, je statický. Ďakujem Catpinovi za pomoc so scenárom.

Mačky a obrazové filtre

Posledná vec, ktorú vás dnes naučím, sú obrazové filtre – veľmi zaujímavá vec, verte mi. Funkcia imagefilter () zoberie hotový obrázok a určitým spôsobom ho zmení – napríklad prevedie do čiernobieleho režimu. Pozrime sa na obrázok, s ktorým budeme pracovať v pôvodnej podobe.

Teraz urobme mačku čiernobielu pomocou funkcie filtrovania obrázkov.

// Nastavenie chybových hlásení
ini_set ("display_errors", "1");
chybové hlásenie (E_ALL);

// skontrolujte, či je nastavený pôvodný obrázok
if (isset ($ _ GET ["zdroj"])) (
// vykonajte základné spracovanie obrazu
$ image = filter_var ($ _ GET ["zdroj"], FILTER_SANITIZE_STRING);

// Načítajte obrázok
$ image = imagecreatefromjpeg ($ image);

// Nastavte ho na čiernobiely režim
imagefilter ($ obrázok, IMG_FILTER_GRAYSCALE);

// Nastavte typ obsahu
hlavička ("typ obsahu: obrázok / jpeg");

// Uložiť obrázok ako 90%
imagejpeg ($ obrázok, "", 90);

// vyčistiť pamäť
imagedestroy ($ image);
}
?>

Vyššie uvedený skript je dostatočne flexibilný na to, aby ste mohli ľahko vytvoriť akýkoľvek čiernobiely výkres - takto:

Do „zdroja“ vložíme akýkoľvek obrázok a čoskoro bude čiernobiely. Pre tých, ktorí plánujú používať túto funkciu na verejných serveroch, budú potrebné dodatočné bezpečnostné opatrenia. Hoci vyššie uvedený skript špecifikuje obrázok .jpeg, môžete túto funkciu použiť na spracovanie ľubovoľného súboru obrázka. Teraz naša mačka vyzerá takto:

Ďalšie filtre:

Na konci tohto návodu vám predstavím niektoré ďalšie grafické filtre a výsledky ich aplikácie.

Filter jasu

Tretí parameter je zodpovedný za jas obrazu:


// tretí parameter nastavuje úroveň jasu obrazu.
imagefilter ($ obrázok, IMG_FILTER_BRIGHTNESS, 40);
imagejpeg ($ obrázok, "", 90);
imagedestroy ($ image);
?>

Gaussovské rozostrenie

Gaussovské rozostrenie, žiadne ďalšie parametre

hlavička ("typ obsahu: obrázok / jpeg");

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

Kontrast

Tretí parameter určuje kontrast

hlavička ("typ obsahu: obrázok / jpeg");
$ image = imagecreatefromjpeg ("cat.jpg");
imagefilter ($ image, IMG_FILTER_CONTRAST, -15);
imagejpeg ($ obrázok, "", 90);
imagedestroy ($ image);
?>

Odstránenie priemernej hodnoty (obrázkový efekt)

Nevyžadujú sa žiadne ďalšie parametre.

hlavička ("typ obsahu: obrázok / jpeg");
$ image = imagecreatefromjpeg ("cat.jpg");
imagefilter ($ obrázok, IMG_FILTER_MEAN_REMOVAL);
imagejpeg ($ obrázok, "", 90);
imagedestroy ($ image);
?>

Vyváženie farieb

Nastaví sýtosť červeného, ​​zeleného, ​​modrého a alfa kanála (voliteľné) v uvedenom poradí

hlavička ("typ obsahu: obrázok / jpeg");
$ image = imagecreatefromjpeg ("cat.jpg");
// parameter alfa kanála je nižšie vynechaný, pretože je voliteľný.
imagefilter ($ image, IMG_FILTER_COLORIZE, 50, 0, 0);
imagejpeg ($ obrázok, "", 90);
imagedestroy ($ image);
?>

Dobudúcna ...

Dúfam, že ste viac-menej prišli na to, ako používať knižnicu GD v PHP. V druhej časti sa pozrieme na niektoré pokročilé techniky a samozrejme sa dozvieme ešte viac zaujímavostí. Využite knižnicu GD a svoju kreativitu a určite mi povedzte, čo ste urobili!

Vytvorenie prázdneho obrázka.

Syntax:

Int imageCreate (int x, int y)

Vytvorí prázdny obrázok veľkosti X na r bodov a vráti svoj identifikátor. Po vytvorení obrázka sa všetka práca s ním vykonáva práve cez tento identifikátor, analogicky ako pracujeme so súborom cez jeho deskriptor.

Príklad:

Vytvorenie nového obrázka s GD a vypíšte ho na obrazovku prehliadača:

imageCreateFromPng

Vytvorte obrázok zo súboru PNG.

Syntax:

Int imageCreateFromPng (reťazec názvu súboru)

Táto funkcia načíta obrázky zo súboru PNG do pamäte a vráti ich ID. Ako po hovore imageCreate ()

Príklad:

Príklad nájdenia chyby pri otváraní grafického súboru.

Funkcia LoadPNG ($ imgname) ($ im = @imagecreatefrompng ($ imgname); / * Pokus o otvorenie * / if (! $ Im) (/ * Pozrite sa, či to zlyhalo * / $ im = imagecreate (150, 30); / * Vytvorte prázdny obrázok * / $ bgc = imagecolorallocate ($ im, 255, 255, 255); $ tc = imagecolorallocate ($ im, 0, 0, 0); imagefilledrectangle ($ im, 0, 0, 150, 30, $ bgc); / * Výstup errmsg * / imagestring ($ im, 1, 5, 5, "Chyba pri načítavaní $ imgname", $ tc);) return $ im;)

imageCreateFromJpeg

Vytvorí obrázok zo súboru JPEG.

Syntax:

Int imageCreateFromJpeg (reťazec názvu súboru)

imageCreate (), ďalšia práca s obrázkom je možná len cez tento identifikátor. Po načítaní z disku sa obrázok rozbalí a uloží do pamäte v rozbalenom formáte, aby ste s ním mohli čo najrýchlejšie vykonávať rôzne operácie, ako je zmena mierky, kreslenie čiar atď.

imageCreateFromGif

Vytvorte obrázok zo súboru GIF.

Syntax:

Int imageCreateFromGif (reťazec názvu súboru)

Táto funkcia načíta obrázky zo súboru do pamäte a vráti ich ID. Ako po hovore imageCreate (), ďalšia práca s obrázkom je možná len cez tento identifikátor. Po načítaní z disku sa obrázok rozbalí a uloží do pamäte v rozbalenom formáte, aby ste s ním mohli čo najrýchlejšie vykonávať rôzne operácie, ako je zmena mierky, kreslenie čiar atď.

To stojí za zmienku GD od verzie 1.6 nepodporuje formát GIF. Preto sa táto funkcia prakticky nepoužíva.

imagePng

Funkcia odošle obrázok vo formáte PNG do ľubovoľného prehliadača alebo súboru.

Syntax:

Int imagePng (int im [, reťazec názvu súboru])

Táto funkcia uloží obrázok určený jeho identifikátorom a umiestnený v pamäti na disk alebo ho odošle do prehliadača.

imageCreate () im.

Ak argument názov súboru Druh obsahu hlavička ().

Hlavička ("Typ obsahu: obrázok / png") pre PNG.

Príklad: Príklad použitia funkcie imagepng ():

Ak chcete uložiť alfa kanál pôvodného obrázka, použite funkciu imagesavealpha ():

imageJpeg

Pošlite obrázok JPEG do prehliadača alebo ho uložte do súboru.

Syntax:

Int imageJPEG (int im [, reťazec názvu súboru [, kvalita int]])

Táto funkcia uloží obrázok určený jeho identifikátorom a uloží ho do pamäte na disk alebo ho odošle do prehliadača.

Samozrejme, najprv je potrebné načítať alebo vytvoriť obrázok pomocou funkcie imageCreate (), t.j. musíme poznať jeho identifikátor im.

Ak argument názov súboru vynechané, potom sa komprimované dáta v príslušnom formáte vyvedú priamo do štandardného výstupného toku, t.j. do prehliadača. Požadovaný titul Druh obsahu zároveň sa nezobrazuje, takže ho musíte zobraziť manuálne pomocou hlavička ().

V skutočnosti musíte v závislosti od typu obrázka vyvolať jeden z troch príkazov:

Hlavička ("Typ obsahu: obrázok / jpeg") pre Jpeg

Tretí voliteľný parameter kvalitu nastavuje kvalitu obrazu (od 0 do 100).

image2WBMP

Výstup obrázka do prehliadača alebo súboru.

Syntax:

Int image2WBMP (obrázok zdroja [, názov súboru reťazca [, prah int]])

Funkcia zobrazí obrázok určený rukoväťou obrázok, do prehliadača alebo do súboru, ktorého názov je určený voliteľným parametrom názov súboru.

Ak sa obrázok zobrazuje v prehliadači, musíte jeho typ WBMP nastaviť ako obrázok / vnd.wap.wbmp pomocou funkcie hlavička ():

Funkcia image2WBMP () k dispozícii PHP iba v prípade verzie knižnice GD 1,8 alebo nižšie.

imageGif

Pošlite obrázok GIF do prehliadača alebo ho uložte do súboru.

Syntax:

Int imageGIF (int im [, reťazec názvu súboru])

Funkcie uložia obrázok určený jeho identifikátorom a umiestnený v pamäti na disk alebo ho vydajú do prehliadača.

Samozrejme, najprv je potrebné načítať alebo vytvoriť obrázok pomocou funkcie imageCreate (), t.j. musíme poznať jeho identifikátor im.

Ak argument názov súboru vynechané, potom sa komprimované dáta v príslušnom formáte vyvedú priamo do štandardného výstupného toku, t.j. do prehliadača. Požadovaný titul Druh obsahu zároveň sa nezobrazuje, takže ho musíte zobraziť manuálne pomocou hlavička ().

V skutočnosti musíte v závislosti od typu obrázka vyvolať jeden z troch príkazov:

Hlavička ("Typ obsahu: obrázok / gif")

Pretože knižnica GD keďže verzia 1.6 nepodporuje formát GIF, táto funkcia sa používa len zriedka.

imageCopy

Kopírovanie časti výkresu.

Syntax:

Int imageCopy (int dst_im, int src_im, int dst_x, int dst_y, int src_x, int src_y, int src_w, int src_h)

Funkcia skopíruje obdĺžnikovú oblasť začínajúcu na pozícii ( src_x, src_y) šírka src_w a výška src_h z obrázku src_im v kreslení dst_im posunutím skopírovanej oblasti ( dst_x, dst_y).

Nasledujúci príklad bude obrázok súbor1.pngúplne skopírované súbor2.png

imageCopyResized

Kopírovanie časti výkresu s mierkou.

Syntax:

Int imageCopyResized (int dst_im, int src_im, int dstX, int dstY, int srcX, int srcY, int dstW, int dstH, int srcW, int srcH)

Táto funkcia je jednou z najvýkonnejších a najuniverzálnejších. Pomocou neho môžete kopírovať obrázky (alebo ich časti), presúvať ich alebo meniť ich mierku.

dst_im nastavuje identifikátor obrázka, do ktorého bude umiestnený výsledok funkcie. Tento obrázok už musí byť vytvorený alebo odovzdaný a musí mať správnu veľkosť.

src_im- identifikátor obrazu, na ktorom sa práca vykonáva. Avšak src_im a dst_im môžu byť rovnaké.

možnosti srcX, srcY, srcW, srcH nastavte oblasť vo vnútri pôvodného obrázka, nad ktorou sa operácia vykoná - respektíve súradnice jeho ľavého horného rohu, šírku a výšku.

Nakoniec štyria dstX, dstY, dstW, dstH určuje umiestnenie na obrázku dst_im, do ktorého sa „vtlačí obdĺžnik určený v predchádzajúcich štyroch“. Upozorňujeme, že ak sa šírka alebo výška dvoch obdĺžnikov nezhoduje, obrázok sa automaticky roztiahne alebo zmenší podľa potreby.

V nasledujúcom príklade je súbor súbor1.jpg rozpoliť a zapísať do súboru súbor2.jp g:

imageDestroy

Zničenie kresby.

Syntax:

Int imageDestroy (int im)

Funkcia ničí rukoväť im predtým vytvorený obrázok (napríklad zatvorenie súboru fclose () po otvorení fopen ()).

Bez obrázkov bude internet dosť nudný. Udržiavanie a správa stoviek alebo tisícok obrázkov pre váš web však môže byť bolesťou hlavy. Keď sa zmení dizajn vašej lokality, možno budete musieť zmeniť všetky svoje obrázky – napríklad previesť všetky obrázky do odtieňov sivej alebo zmeniť ich veľkosť na 50 % ich pôvodnej veľkosti. Môžete tiež komprimovať alebo orezať rôzne obrázky. Robiť to ručne je časovo náročné a náchylné na chyby, ale s trochou znalostí programovania sa to dá zautomatizovať.

V tomto návode sa dozvieme o knižnici GD (Graphic Draw) v PHP. Uvidíte, ako možno túto knižnicu použiť na manipuláciu s obrázkami zmenou veľkosti, orezaním, otočením alebo filtrovaním.

čo je GD?

PHP dokáže oveľa viac, než len posielať HTML správy vašim návštevníkom. Má napríklad schopnosť manipulovať s obrázkami. Nielen to, ale môžete tiež vytvoriť svoje vlastné obrázky od začiatku a potom ich uložiť alebo poskytnúť používateľom.

PHP dokáže splniť takmer všetky vaše základné potreby manipulácie s obrázkami pomocou knižnice GD, skratky pre Graphic Draw.

Inštalácia

Ak používate systém Windows, môžete súbor zahrnúť php_gd2.dll ako rozšírenie k php.ini... Ak používate niečo ako XAMPP, súbor nájdete php_gd2.dll v katalógu xampp \ php \ ext... Môžete tiež skontrolovať, či je GD nainštalovaný vo vašom systéme pomocou funkcie phpinfo (); ... Ak sa pozriete na výsledok, nájdete niečo podobné ako nasledujúce.

Môžete tiež navštíviť stránku Požiadavky a inštalácie, kde sa dozviete viac o inštalácii.

Generovanie obrázkov pomocou PHP GD

Prvým krokom k manipulácii s obrázkami pomocou PHP je ich načítanie do pamäte ako zdroj obrázkov. Dá sa to dosiahnuť použitím rôznych funkcií pre rôzne formáty. Všetky tieto funkcie majú veľmi podobné názvy, takže sú ľahko zapamätateľné.

Vytvorte nový obrázok

Funkcia imagecreatetruecolor () je užitočná, ak nemáte pôvodný zdroj obrázka, ktorý chcete upraviť. Vyžaduje dva celočíselné parametre: šírku a výšku. Ak všetko pôjde podľa plánu, vráti zdroj obrázka. Vrátený zdroj obrázka je v podstate čierny obrázok s danou šírkou a výškou.

Nahrávanie súboru obrázka

Ak plánujete pracovať s obrázkami, ktoré sú už niekde uložené, bude sa vám hodiť funkcia ako imagecreatefromjpeg (), imagecreatefrompng () a imagecreatefromgif (). Vytvoria zdroj obrázka so všetkými údajmi z načítaného súboru obrázka. Tieto funkcie preberajú jeden parameter, ktorý určuje umiestnenie obrázka, ktorý sa má načítať, ako je adresa URL alebo cesta k súboru.

Vytvorenie obrázka z reťazca

Knižnica GD vám tiež umožňuje vytvárať obrázky z reťazca pomocou funkcie imagecreatefromstring () v PHP. Pamätajte, že pred imagecreatefromstring () budete musieť pre daný reťazec použiť base64_decode (). Funkcia dokáže automaticky zistiť, či je typ obrázka JPG, PNG, GIF alebo iný podporovaný formát.

Otáčanie, zmena mierky, orezanie a prevrátenie obrázka

Niektoré bežné operácie, ktoré môžete vykonať s obrazovým podkladom, sú rotácia, zmena mierky, orezanie a prevrátenie.

Rotácia

Obrázok, ktorý ste už načítali do skriptu, môžete otočiť pomocou funkcie imagerotate (). Otočí obrázok v danom uhle, pričom ako stred otáčania použije stred obrázka. Uhol je reprezentovaný ako hodnota s pohyblivou rádovou čiarkou a PHP ho považuje za hodnotu uhla natočenia. Niekedy bude mať otočený obrázok iné rozmery v porovnaní s pôvodnou verziou. To znamená, že po otočení získate otvorenú plochu. Tretím parametrom funkcie imagerotate () je možné nastaviť farbu pozadia prázdnej plochy po otočení.

Škálovanie

Pomocou knižnice GD je veľmi jednoduché zmeniť mierku obrázka. Funkcii imagescale () stačí odovzdať zdroj obrázka, ako aj šírku a výšku. Ak znížite výšku, GD zmení mierku obrázka na zadanú šírku pri zachovaní pomeru strán. Môžete tiež určiť režim zmeny mierky obrázka. Dá sa nastaviť na IMG_NEAREST_NEIGHBOUR, IMG_BILINEAR_FIXED, IMG_BICUBIC atď. Dôležité je zapamätať si, že táto funkcia vracia nový zdroj zmenšeného obrázka namiesto zmeny pôvodného.

Prerezávanie

Pomocou funkcie imagecrop () v GD môžete orezať ľubovoľný zdroj obrázka. Prvý parameter je pôvodný zdroj obrázka a druhý parameter je asociatívne pole s kľúčmi x, y, šírka a výška, ktoré určuje veľkosť pozície orezávacieho poľa.

Vyššie uvedený obrázok motýľa bol orezaný pomocou nasledujúceho kódu:

$ im_php = imagecreatefromjpeg ("cesta / k / obrázku"); $ veľkosť = min (imagesx ($ im_php), obrázky ($ im_php)); $ im_php = orezanie obrázka ($ im_php, ["x" => veľkosť $ * 0,4, "y" => 0, "šírka" => veľkosť $, "výška" => veľkosť $]); $ im_php = mierka obrazu ($ im_php, 300);

V podstate do premennej $ size uložíme dĺžku najmenšej strany. Táto premenná sa potom používa na definovanie hranice nášho orezového obdĺžnika. Nakoniec sa obrázok zmenší tak, aby bol široký a dlhý len 300 pixelov. Získame tak štvorcový obrázok.

Preklápať obrázky

Obrázky je možné prevrátiť horizontálne, vertikálne alebo v oboch smeroch pomocou funkcie imageflip (). Ako prvý parameter sa použije obrazový prvok, ktorý chcete prevrátiť, a ako druhý parameter sa použije režim prevrátenia. Režim otáčania je možné nastaviť na IMG_FLIP_HORIZONTAL, IMG_FLIP_VERTICAL alebo IMG_FLIP_BOTH.

Obrázok vľavo hore na obrázku vyššie je originál. Obrázok vpravo hore bol vytvorený pomocou IMG_FLIP_HORIZONTAL, obrázok vľavo dole bol vytvorený pomocou IMG_FLIP_VERTICAL a obrázok vpravo dole bol vytvorený pomocou IMG_FLIP_BOTH. (Obrázok Havrana z Pixabay.)

Použitie filtrov na obrázok

GD má tiež veľmi užitočnú funkciu imagefilter (), ktorá dokáže použiť filtre na rôzne zdroje obrázkov načítané pomocou funkcií z predchádzajúcich obrázkov. Táto funkcia môže mať rôzne parametre v závislosti od použitého filtra.

Najprv zadajte obrazový prvok a názov filtra, ktorý chcete použiť. Môžete ho nastaviť na jeden z 12 preddefinovaných typov filtrov uvedených v dokumentoch.

  • IMG_FILTER_NEGATE: invertuje (zmení ako v negatíve) farby na obrázku
  • IMG_FILTER_GRAYSCALE: odstráni farbu z obrázka
  • IMG_FILTER_BRIGHTNESS: zosvetlí alebo stmaví obraz
  • IMG_FILTER_CONTRAST: Zvyšuje kontrast obrazu
  • IMG_FILTER_COLORIZE: zafarbí obrázok na zvolenú farbu
  • IMG_FILTER_EDGEDETECT: Zvýrazní okraje obrázka
  • IMG_FILTER_EMBOSS: Podobné ako detekcia hrán, ale dáva každej hrane zvýšený vzhľad
  • IMG_FILTER_GAUSSIAN_BLUR: Rozostrí obraz pomocou Gaussovej metódy
  • IMG_FILTER_SELECTIVE_BLUR: Rozmazáva obraz pomocou selektívnej metódy
  • IMG_FILTER_MEAN_REMOVAL: Efekt vytvorenia štylizovaného obrázka
  • IMG_FILTER_SMOOTH: Vyhladzuje zubaté okraje obrazu
  • IMG_FILTER_PIXELATE: rozpixeluje obrázok

Niektoré filtre ako NEGATE, GREYSCALE, EDGE_DETECT a EMBOSS nepotrebujú ďalšie údaje. Iné filtre, ako napríklad BRIGHTNESS, CONTRAST a SMOOTH, môžu mať ďalší parameter, ktorý určuje úroveň jasu, kontrastu alebo plynulosti vo výslednom obrázku. Parameter PIXELATE vám umožňuje zadať dva ďalšie parametre: veľkosť bloku a režim pixelov. Nakoniec filter COLORIZE preberá štyri parametre, ktoré definujú hodnoty pre červenú, zelenú a modrú zložku, ako aj pre alfa kanál.

Obrázok v ľavom hornom rohu je originál. Obrázok vpravo hore bol vytvorený pomocou filtra COLORIZE, obrázok vľavo dole bol vytvorený pomocou filtra GREYSCALE a obrázok vpravo dole bol vytvorený pomocou filtra BRIGHTNESS. (Tento obrázok motýľa bol nájdený na Pixabay.)

Ďalšie užitočné funkcie pre prácu s obrázkami

Mali by ste si byť vedomí aj niektorých ďalších bežných funkcií GD, ktoré môžu byť z času na čas užitočné.

Načítavanie rozmerov obrázka

Šírku a výšku zdroja obrázkov môžete určiť pomocou funkcií imagesx () a imagesy ().

Ďalšiu funkciu s názvom getimagesize () možno použiť aj na získanie šírky a výšky obrázka spolu s jeho typom. Táto funkcia vráti pole s prvkami definujúcimi šírku, výšku a pomer strán. Prvé dva prvky poľa popisujú šírku a výšku a tretí prvok obsahuje konštantu definujúcu formát súboru: jeden z IMAGETYPE_PNG, IMAGETYPE_GIF atď.

Uloženie obrázka

Po vykonaní všetkých potrebných zmien v obrázku ho s najväčšou pravdepodobnosťou budete chcieť odoslať do prehliadača alebo uložiť ako súbor. V každom prípade budete musieť použiť jednu z výstupných funkcií GD, ako napríklad imagejepg (), imagepng () alebo imagegif (). Zdroj obrázka odošlete jednej z týchto výstupných funkcií a ak chcete obrázok uložiť do súboru, poskytnete aj názov súboru. Kvalitu výstupného obrazu môžete ovládať aj voliteľným tretím parametrom v závislosti od typu obrazu.

Zmeňte veľkosť všetkých obrázkov v adresári

Uveďme to, čo sme sa naučili, do praxe, aby sme niečo urobili. V tejto časti zmeníme veľkosť všetkých obrázkov JPEG v konkrétnom adresári na šírku 640 pixelov. Výška sa vypočíta automaticky na základe rozmerov pôvodného obrázka.

Upravené obrázky uložíme do nového priečinka tzv Zmenená veľkosť... Všetky pôvodné obrázky majú v tomto prípade rovnaké rozmery, ale kód bude správne fungovať s obrázkami, ktoré majú rôzne veľkosti a proporcie.

$ adresár = "Príroda /"; $ images = glob (adresár $. "*. jpg"); foreach ($ obrázky ako $ obrázok) ($ im_php = imagecreatefromjpeg ($ obrázok); $ im_php = mierka obrázka ($ im_php, 640); $ new_height = obrázky ($ im_php); $ new_name = str_replace ("- 1920 x 1080", "- 640x ". $ New_height, basename ($ image)); imagejpeg ($ im_php, $ adresár." Zmenená veľkosť /.$ new_name);)

Vo vyššie uvedenom kóde začneme pomocou funkcie glob () na vyhľadanie všetkých obrázkov s príponou .jpg v adresári s názvom Príroda... Súbory s obrázkami sú uložené v poli a my cez ne iterujeme jeden po druhom.

Keďže všetky obrázky, ktoré chceme upraviť, sú JPEG, použijeme na ich načítanie do skriptu funkciu imagecreatefromjpeg (). Funkcia imagescale () potom slúži na zmenu veľkosti obrázka na konkrétnu šírku – v našom prípade 640 pixelov. Neurčili sme pevnú výšku, aby sa výška vypočítala automaticky.

Každý z pôvodných obrázkových súborov bol pridaný s -1920 x 1080 k ich súboru, aby sa označili jeho rozmery. Používame str_replace () na pôvodný názov súboru a nahradiť -1920X1080 na novú veľkosť obrázka.

Nakoniec upravené obrázky uložíme do priečinka s názvom Zmeniť veľkosť s novými názvami súborov. Môžete tiež odovzdať tretí parameter funkcii imagejpeg () na nastavenie kvality uloženého obrazového súboru. Ak vynecháte tretí parameter, obrázky sa uložia s predvolenou kvalitou 75.

Použitie filtrov odtieňov sivej a kontrastu na každý obrázok v katalógu

Tentokrát použijeme dva rôzne filtre na každý obrázok v našom adresári a konečný výsledok uložíme do iného adresára bez vykonania akýchkoľvek zmien v názve súboru. Poďme sa ponoriť do kódu a neskôr vysvetlím, čo jednotlivé funkcie robia.

$ adresár = "Príroda /"; $ images = glob (adresár $. "*. jpg"); foreach ($ obrázkov ako $ obrázok) ($ im_php = imagecreatefromjpeg ($ obrázok); imagefilter ($ im_php, IMG_FILTER_GRAYSCALE); imagefilter ($ im_php, IMG_FILTER_CONTRAST, -25); $ new_name = základný názov ($ obrázok $); imagejpg , $ adresár. "Odtiene šedej /".$ new_name);)

Ako vidíte, načítavame obrázky z adresára Príroda rovnaké ako v predchádzajúcom príklade. Tentoraz však použijeme funkciu imagefilter () na použitie filtrov na načítaný zdroj obrázkov.

Všimnite si, že imagefilter () zmení pôvodný obrázok a vráti hodnotu TRUE alebo FALSE v závislosti od úspechu alebo zlyhania operácie. Toto sa líši od funkcie imagescale (), ktorú sme použili v predchádzajúcej časti a ktorá vrátila zdroj zmenšeného obrázka.

Ďalšia dôležitá vec, ktorú treba mať na pamäti, je, že kontrastný filter nadobúda hodnoty od -100 do 100. Záporné hodnoty znamenajú väčší kontrast a kladné hodnoty znamenajú menší kontrast. Toto je opak toho, čo by niektorí ľudia očakávali! Hodnota 0 ponechá obrázok nezmenený.

Na druhej strane, filter jasu má minimálne a maximálne limity -255 a 255. Záporná hodnota v tomto prípade znamená minimálny jas a kladná hodnota znamená maximálny jas.

Názov súboru získame z cesty k súboru pomocou funkcie basename () a následne obrázok uložíme pomocou funkcie imagejpeg ().

Záverečné myšlienky

Účelom tohto návodu bolo predstaviť vám knižnicu GD v PHP a naučiť sa používať všetky jej funkcie, aby ste si uľahčili život. Príklady na konci tutoriálu môžete použiť ako návod na písanie vlastných zobrazovacích skriptov. Napríklad môžete zmeniť veľkosť obrázka iba vtedy, ak je väčší ako určený limit, a to určením jeho šírky pomocou funkcie imagesx ().

Všetky tieto funkcie otvárajú veľa možností, ako si prácu s obrázkami uľahčiť a v konečnom dôsledku ušetria veľa času. Ak máte nejaké otázky týkajúce sa tohto tutoriálu, dajte mi vedieť v komentároch.

Vážení účastníci projektu DvizhKod! Dnes vás čaká ďalšia zaujímavá téma. Všetci sme zvyknutí povedzme nahrávať na sociálne siete nových avatarov. Ako sa však prispôsobia na správnu veľkosť? Čo sa deje na serveri? Odpovede na tieto a mnohé ďalšie otázky na vás čakajú pod strihom.

Áno, ak sa niekto nevyzná, tak v internetovej terminológii „strih“ (z anglického cut – cut) je miesto, ktoré rozdeľuje správy na krátku (vo všeobecnom zozname) a úplnú prezentáciu.

Mnoho ľudí vie, že vyvíjam svoj vlastný systém správy stránok s názvom Cogear (Cogear, http://cogear.ru). Príbeh je zložitý a dlhý, no tvrdohlavo idem za cieľom.

Poďme sa pozrieť na základné aspekty práce s obrázkami.

PHP má vstavanú knižnicu GD. Tu je jeho dokumentácia:

http://php.net/manual/ru/book.image.php

Na tejto stránke nájdete obrovské množstvo veľmi odlišných funkcií. Ale neľakajte sa. Nás zaujímajú veľmi konkrétne.

Ako vidíte, práca s obrázkami zatiaľ prebieha vo forme procedúr (funkcií), takže objektovo orientovaný shell si musíte napísať sami.

Najjednoduchší príklad práce s obrázkom:

Skús to na lokálnom počítači.

Vytvorte súbor image.php(Mám lokálnu doménu na experimenty test.miestny).

Umiestnite obrázok 1.jpg do koreňového priečinka stránky test.local:

V prehliadači voláme http: //test.local/image.php (vo vašom prípade iná adresa).

Nájdite obrázok 2.jpg v priečinku:

Ako vidíte, proporcie sa nezachovali. Pretože sme ich nespočítali.

Opravme náš skript, aby prepočet prebehol:

$ ratio_orig) ($ šírka = $ výška * $ ratio_orig;) else ($ výška = $ šírka / $ ratio_orig;) // presuňte obrázok zo súboru na plátno so zmenou mierky imagecopyresampled ($ image_p, $ image, 0, 0 , 0 , 0, $ šírka, $ výška, $ šírka_orig, $ výška_orig); // výstup imagejpeg ($ image_p, "2.jpg", 100);

Pozrime sa na výsledok:

Keďže sme počítali na výšku, časť výsledného obrazu sa ukázala ako čierna (pôvodná farba vytvoreného plátna).

Čo ešte môžete urobiť s obrázkom? Orezať, otáčať, vrstviť jeden na druhý, maľovať.

Určite vás moja trieda zaujme pre prácu s obrázkami. Mimo systému nefunguje, keďže ide o ovládač pre ozubené koleso (modul) „Obrázky“.

Ale nájdete v ňom veľa zaujímavostí:

* @copyright Copyright (c) 2012, Dmitry Belyaev * @license http://cogear.ru/license.html * @link http://cogear.ru * / class Image_Driver_GD rozširuje Image_Driver_Abstract (/ ** * Vytvorí obrázok * / public function create () (prepínač ($ this-> info-> type) (case IMAGETYPE_JPEG: case IMAGETYPE_JPEG2000: $ this-> source = imagecreatefromjpeg ($ this-> info-> file); break; case IMAGETYPE_PNG: $ this - > source = imagecreatefrompng ($ this-> info-> file); imagecolortransparent ($ this-> source, imagecolorallocate ($ this-> source, 0, 0, 0)); imagealphablending ($ this-> source, FALSE) ; imagesavealpha ($ this-> source, TRUE); break; case IMAGETYPE_GIF: $ this-> source = imagecreatefromgif ($ this-> info-> file); imagecolortransparent ($ this-> source, imagecolorallocate ($ this-> source , 0, 0, 0)); imagealphablending ($ this-> source, FALSE); imagesavealpha ($ this-> source, TRUE); break; case IMAGETYPE_ICO: $ this-> source = imagecreatefromwbmp ($ this-> info- > súbor); zlomiť;)) / ** * Zničí obrázok * / public function cancel () (imagedestroy ($ this-> source); is_resource ($ this-> target) && imagedestroy ($ this-> target); ) / ** * Vytvorí cieľový obrázok * * @param zmiešaný $ šírka * @param zmiešaný $ výška * / verejná funkcia createTarget ($ šírka, $ výška) ($ this-> target = imagecreatetruecolor ($ šírka, $ výška); ak ($ this-> info-> type == IMAGETYPE_PNG OR IMAGETYPE_GIF == $ this-> info-> type) (imagecolortransparent ($ this-> target, imagecolorallocate ($ this-> target, 0, 0, 0)); imagealphablending ($ this-> target, FALSE); imagesavealpha ($ this-> target, TRUE);) return $ this-> target;) / ** * Mierka obrázka * * @param int | string $ šírka Šírka * @ param int | string $ výška Výška * @param string $ fit Typ zmeny mierky šírka, výška, prispôsobenie * @param int | string $ mierka Ktoré obrázky škálovať ľubovoľne, hore, dole * @return object Obrázok * / zmena veľkosti verejnej funkcie ($ šírka , $ výška, $ fit = "width", $ scale = "any") ($ source_width = $ this-> smartSize ($ šírka, "width")); $ source_height = $ this-> smartSize ($ výška, "výška" "); // Skontrolujte prepínač typu mierky ($ fit) (// Ak je niť na šírku, potom upravíme výšku na požadované proporcie case "width": $ width = $ source_width; $ výška = okrúhle (($ source_width * $ this-> info-> height) / $ this-> info-> width); prestávka; // Ak upravujete výšku, upravte šírku na požadované proporcie case "height": $ width = round (($ this-> info-> width * $ source_height) / $ this-> info-> height); $ výška = $ source_height; prestávka; case "crop": if ($ this-> info-> width> $ this-> info-> height) ($ width = round (($ this-> info-> width * $ source_height) / $ this-> info -> výška); $ výška = $ source_height;) else ($ šírka = $ source_width; $ výška = okrúhle (($ this-> info-> height * $ source_width) / $ this-> info-> width);) prestávka; // V predvolenom nastavení stačí roztiahnuť default: case "fit":) // Skontrolujte, či sa vykoná zmena mierky ($ scale) (// Ak je obrázok väčší ako zadané rozmery, v prípade "hore" sa mu nič nestane: if (šírka $< $this->info-> šírka && výška $< $this-> info-> vyska) (vratit $ this;) break; // Ak je obrázok menší ako zadané rozmery, nič sa mu nestane v prípade "dole": if ($ width> $ this-> info-> width && $ height> $ this-> info-> height) (return $ toto ;) zlomiť; case "any": default: // Nerobiť nič. Filonymum) $ this-> target = $ this-> createTarget ($ šírka, $ výška); if (imagecopyresampled ($ this-> target, $ this-> source, 0, 0, 0, 0, $ width, $ height, $ this-> info-> width, $ this-> info-> height)) ( $ this-> source = $ this-> target; $ this-> info-> width = $ width; $ this-> info-> height = $ height; if ("crop" == $ fit) (vrátiť $ this -> orezať ("stred", "stred", $ source_width, $ source_height);)) return $ this; ) / ** * Orezanie obrázka * * @param zmiešaný $ x Súradnica orezania x * @param zmiešaný $ y Súradnica orezania y * @param zmiešaný $ šírka Šírka orezania * @param zmiešaný $ výška Výška orezania * @objekt návratu Obrázok * / orezanie verejnej funkcie ($ x, $ y, $ šírka, $ výška) ($ x = $ this-> smartSize ($ x, "width") - $ šírka / 2; $ y = $ this-> smartSize ($ y , "height") - $ výška / 2; $ width = $ this-> smartSize ($ width, "width"); $ height = $ this-> smartSize ($ height, "height"); $ this-> target = $ this-> createTarget ($ width, $ height); if (imagecopyresampled ($ this-> target, $ this-> source, 0, 0, $ x, $ y, $ width, $ height, $ width, $ výška)) ($ this-> source = $ this-> target; $ this-> info-> width = $ width; $ this-> info-> height = $ height;) return $ this;) / ** * Zlúči obrázky * / zlúčenie verejnej funkcie (obrázok $, $ x, $ y, $ percent = 100) ($ x = $ this-> smartSize ($ x, "šírka"); $ y = $ this-> smartSize ( $ y, "height"); if (imagecopyerge ($ this-> source, $ image-> getSource (), $ x, $ y, 0, 0 , $ obrázok-> objekt () -> obrázok-> šírka, $ obrázok-> objekt () -> obrázok-> výška, $ percent)) () return $ this; ) / ** * Uloží obrázok * / verejná funkcia uložiť ($ file = NULL, $ options = pole ()) ($ this-> target OR $ this-> target = $ this-> source; if (strpos ($ súbor , ".") ALEBO $ súbor = $ this-> info-> súbor) ($ ext = pathinfo ($ súbor, PATHINFO_EXTENSION); $ ext = strtolower ($ ext);) else ($ ext = strtolower ($ súbor ); $ file = NULL;) switch ($ ext) (vec "jpg": case "jpeg": $ options OR $ options = 90; imagejpeg ($ this-> target, $ file, $ options); break; case " gif ": imagecolortransparent ($ this-> target, imagecolorallocatealpha ($ this-> target, 0, 0, 0, 127)); imagealphablending ($ this-> target, FALSE); imagesavealpha ($ this-> target, TRUE ); imagegif ($ this-> target, $ file); break; case "png": imagealphablending ($ this-> target, FALSE); imagesavealpha ($ this-> target, TRUE); if (is_numeric ($ options) ) ($ kvalita = $ možností; $ filtre = PNG_NO_FILTER;) inak ($ ​​kvalita = isset ($ možností ["kvalita"])? $ možnosti ["kvalita"]: 9; $ filters = isset (možnosti $ ["filtre")]? $ možnosti ["filtre"]: PNG_NO_FILTER; ) imagepng ($ this-> target, $ file, $ kvalita, $ filtre); prestávka; ) $ this-> zničiť (); ) / ** * Výstupný obrázok * / výstup verejnej funkcie (formát $, $ options) ($ this-> save ($ format, $ options);))

Ako to v systéme funguje? Načo je toľko kódu?

Pozri:

$ obrázok = nový obrázok ("1.jpg"); $ obrázok-> zmeniť veľkosť (200 200, "šírka") -> orezať (200 200) -> uložiť ("2, jpg);

Rozumieš? Automaticky pracuje so všetkými požadovanými formátmi. Funkcionalitu je možné v prípade potreby rozšíriť.

Domácou úlohou pre vás bude robiť to, čo je uvedené vyššie (až do mojej triedy) na miestnom počítači. Ak je to žiaduce a čas na experimentovanie s parametrami.