Zmenšení obrázků v prohlížeči

Pokud na server nahráváme obrázky a chceme omezit jejich rozměr, můžeme je zmenšit na serveru. Problém s tímto přístupem je v tom, že se obrázek musí na server nahrát celý, což jednak dlouho trvá a jednak to může narazit na limity velikosti nahrávaných souborů. S neustále narůstajícím rozlišením fotoaparátů to je čím dál větší problém. Ideální je proto obrázky zmenšit už na straně klienta.

Osobně k tomu používám editor obrázků, to je ale poměrně komplikované a pro běžné uživatele prakticky nepoužitelné. Před rokem mě napadlo, že ideální místo pro zmenšení obrázku by byla extenze v prohlížeči. K mému překvapení jsem ale tehdy žádnou nenašel.

Dnes jsem si řekl, že bych se do napsání této extenze možná přece jen pustil. Ověřoval jsem pro jistotu, jestli jsem loni hledal správně a simsalabim – objevil jsem extenzi Shrunked. Podle všeho je stará (nebo přinejmenším známá) asi týden. Kdybych si trochu pospíšil, mohl jsem udělat něco užitečného, takhle to mám zase bez práce…

Extenze je navržená obstojně. Vytknul bych jí to, že zmenšuje jen obrázky JPG a ignoruje ostatní formáty a že všechny obrázky ve formuláři zmenšuje stejně. Za přínosnou naopak považuji možnost ve formuláři určit požadovanou velikost obrázků.

Jakub Vrána, Osobní, 18.3.2009, on-line

Diskuse

pojízdná kočka:

Vida ho! Pokud se pamatuju, na builder.cz se jednou dobou toto řešilo, a konsensem byl flashový plugin + slabá bezpečnost nastavená v prohlížeči. Takže nic moc..
18.3.2009 07:14:18

pojízdná kočka:

pardon, ne flashový plugin, ale Flash. A i tak by procento uživatelů, kterým by to fungovalo, bylo malé.

No, a ještě bych dodala, že s tím, jak přibývá běžných Frantů uživatelů, kteří na internet klidně nahrávají neupravené několikamegové fotky přímo z desetimegapixelových foťáků, tak něco takového je potřeba jako sůl. Za pár let něco takového bude existovat i pro videa…
18.3.2009 07:19:30

Sniper:

Bohuzel to neresi problem s nahravanim velkejch obrazku - pokud klient ten addon nema nainstalovanej (nebo nepouziva FF), stejne musi nahrat na server obrazek v originalni velikosti. Ano, je to uzitecny o tom vedet a pokud treba clovek dela fotogalerii, kterou bude moct plnit jenom admin, tak do pozadavku ten plugin dat. Ale pro verejnou cast mi to prijde nepouzitelny. Nebo jsem neco prehlidnul?
18.3.2009 07:22:24

ikona Jakub Vrána:

Ano, je to určeno hlavně pro administrační rozhraní, kde se to oprávněným uživatelům nainstaluje. Ve veřejných rozhraních se to dá uživatelům doporučit, ale nedá se na to spolehnout – serverová část je nezbytná v obou případech.
18.3.2009 07:26:44

js:

vím, že je to trochu z bláta do louže, ale zkuste se mrknout na javový opensource JUpload. je to asi trochu divoce napsané, ale je vidět, že to postupně co do funkčnosti upravuje praxe (ftp, http, oprávnění, rozsekání velkých souborů na kousky). s posledními verzemi mám docela dobrou zkušenost. http://jupload.sourceforge.net
18.3.2009 07:48:13

Pari:

Díky za dobrý tip. Určitě v nějakém budoucím projektu použiji.
18.3.2009 09:21:53

ikona Petr Lněnička:

Výborný tip, díky. Jen pro zajímavost - klientům ukazujeme použití BIMPu (http://cerebralsynergy.com/download.php?view.52) - hromadně zmenší fotografie v celém adresáři.
18.3.2009 11:48:17

kluvi:

a neslo by to resit treba pomoci JS?
18.3.2009 12:37:16

ikona Jakub Vrána:

To byla má první myšlenka a bylo by to ideální řešení, ale JS se nedostane k souborům na disku uživatele.
18.3.2009 23:30:15

Lukyer:

Ja zase pri uploadu obrazku doporucuju klientovi pouzit http://mypictr.com/?size=80x80 ... jednoducha a velmi intuitivni sluzbicka a zdarma ... V JS se moc neorientuji, ale kdyby umel zjistit rozmer uploadovaneho obrazku(coz asi tezko bude mit pristup k takove "nebezpecne informaci"), tak by se to mohlo sikovne skloubit ...
18.3.2009 13:16:18

ikona Jakub Vrána:

Bohužel zůstává ten problém, že se celý velký soubor musí přenášet na server (i když cizí).
18.3.2009 23:31:32

mach:

Jen bych upozornil, ze na obrazcich s prilis velkym rozlisenim muze umirat i gd2 knihovna a neda se to odchytit zadnou (mne znamou) PHP-ckovskou cestou pro kontrolu chyb.
18.3.2009 19:06:37

Juraj:

Doporučujem IMagick, má o dosť menšie nároky na pamať.
19.3.2009 02:12:11

matak:

odchytit se to dá http://www.webfaq.cz/clanek/Allowed-memory-…-2558-bytes
19.3.2009 09:02:13

ikona Bohumír Bednařík (BoboCop):

Na zmenšování obrázků používám Picasu od Googlu a jsem s ní naprosto spokojen. Umí obrázky zmenšit dávkově a poměrně rychle (podle počtu obrázků a zřejmě i podle jejich velikosti) a navíc si poradí i s obrázky/fotkami "na výšku" (na rozdíl od některých programů, se kterými jsem se setkal). Práci s ní IMHO zvládně i BFU, protože je to prakticky jen o klikání. Takže stačí takového BFU naučit používat jednoducchou funkci programu Picasa a je vystaráno.
18.3.2009 23:20:57

ikona v6ak:

// Snad ty reakce fungují už i v Opeře mini
Ten přístup na disk bude asi jediný problém.
BTW neznáte někdo nějaký způsob, kterým může JavaScript zjistit postdata? Pokud ano, pak možná mám trik.
19.3.2009 00:54:11

KarolF:

Ja pouzivam na hromadnu upravu IrfanView. Umoznuje zmenu percentualnu a aj na zadane rozmery.
19.3.2009 03:17:57

Martin Kopta:

Mě trochu zaráží název webu, odkud ten add-on pochází. Většinou se snažím neinstalovat něco, co si říká dark trojan. :-)
19.3.2009 04:53:07

ikona Jakub Vrána:

Schválně jsem zdrojový kód prohlédl a na žádný problém jsem nenarazil. Alespoň zatím, dokud se to nestane populární, pak v automatickém update třeba něco přijede :-).
19.3.2009 05:05:28

Jan Kadeřábek:

Myslím, že lepším řešením (nezávislost na prohlížeči, bez nutnosti instalovat rozšíření) je použití java appletu nebo flashe, který to zmenší na straně klienta a uploaduje.
Něco jako je tohle http://upload.thinfile.com/image/
Bohuželva (pro chudáky jako jsem já) jsem nenašel nic bezplatného.
21.3.2009 07:56:00

Holmistr:

Sdílím názor Jana Kadeřábka, určitě bych na to použil např. Java Web Start...sice musí mít klient nainstalovanou Javu, ale to je skoro samozřejmost..
29.11.2010 14:39:24

Oldřich Válek:

Našel jsem tohle:
http://www.shift8creative.com/projects/agil…/index.html
Obrázek to asi pomocí flashe zmenší a až potom odešle, dobré je že to rovnou umí i s více soubory. Zatím mi to funguje dobře.
(projíždění internetu cca 6 hodin musí něco udělat... :D )
10.8.2011 13:40:04

Oldřich Válek:

Takže zase tak úplně dokonalé řešení to neni, protože když se tam šoupne třeba 10 obrázků s rozlišením 4000*3000px aby je to zmenšilo na 800*600px tak se to podaří tak na 5/10 pokusů.. při to zbytku zamrzne flashplayer. Takže by to asi ještě chtělo najít něco jiného. Ono je dobré že to umí třeba zpracovat 20fotek z rozlišení 1024*768px na 800*600px ale dneska z foťáků vycházejí prostě jiná rozlišení. A pokud by to předtím BFU měl ještě upravovat v nějakém jiném programu, tak to může dát rovnou na těch 800*600. Takže jdu znovu potrápit google :)
10.8.2011 17:39:41

Oldřich Válek:

Tak teď už si připadám trochu blbě když si tu po 2 odpovídám :) Ale tohle sem prostě musím postnout: http://www.plupload.com/index.php
Umí to resize před odesláním, lze si vybrat mezi HTML5, flash, gears, silverlight a další... vpohodě to bez zamrzání nahraje hodně fotek (zkoušel jsem max 141 a vpohodě).
10.8.2011 19:11:41
avatar © 2005-2024 Jakub Vrána. Publikované texty můžete přetiskovat pouze se svolením autora. Ukázky kódu smíte používat s uvedením autora a URL tohoto webu bez dalších omezení Creative Commons. Můžeme si tykat. Skripty předpokládají nastavení: magic_quotes_gpc=Off, magic_quotes_runtime=Off, error_reporting=E_ALL & ~E_NOTICE a očekávají předchozí zavolání mysql_set_charset. Skripty by měly být funkční v PHP >= 4.3 a PHP >= 5.0.