Textová Captcha 3D Captcha jako FormControl

Komponenta přidává do formulářů v Nette Frameworku nový bezpečnostní prvek – tzv. Captchu, neboli text v obrázku, který je nutné správně opsat. Tato captcha je skutečně bezpečná, neboť text zobrazuje jako neuplný 3D průmět, tudíž skutečně není možné ji strojově zpracovat.

Tato komponenta není kompatibilní s Nette od verze 0.92 výš, včetně, kvůli BC breaku metody FormControl::attached() (viz. changelog), ke kterému došlo v Nette v0.92.

Tato nekompatiblita se projevuje tím, že captchu nelze v nekompatibilních verzích Nette zvalidovat – tudíž formulář s ní nelze nikdy úspěšně odeslat.

Problém lze velmi snadno vyřešit přidáním volání parent::attached() na první řádek metody Captcha3D::attached() v souboru Captcha3D.php.

Na opravě a vydání nové verze této komponenty se pracuje, děkujeme za pochopení.

Verze	0.9
Kompatibilní s Nette	0.9 a 0.91
Demo	http://beta.dvojmo.cz/…demo/public/
Download	Captcha3D.rar (134 kB)
Homepage	http://beta.dvojmo.cz/…e-framework/
Forum thread	http://forum.nette.org/…-formcontrol?…
Autor	Tomáš Jukin
Licence	MIT

Úvodem

Tato komponenta za svou existenci více než-li mě vděčí především dvěma lidem: Vítězslavu Plachému a Martinu Hozíkovi. Vítězslav je autorem jednodušší verze Captchi jako Nette Form Controlu a značná část kódu této Captchi je převzata z jeho komponenty. Martin je zase autorem kódu pro vykreslesní 3D Captchi a propagátorem této myšlenky v naší republice. I já sám jsem se o této captche dozvěděl z jeho blogu.

Mou jedinou zásluhou je propojení obou výše uvedených kódů do jednoho. A výsledek si můžete prohlédnout v online demu.

Více informací o pozadí projektu se můžete dočíst na homepage projektu na mém blogu.

Komponenta ještě není ve finální verzi, tak na to prosím berte ohled…

Tady se pojďme podívat na to, jak se to používá…

Instalace

Po stažení archivu je z něj nutné přidat do aplikace následující soubory:

V adresáři libs vytvořte pro 3D Captchu nějakou složku, já osobně používám Captcha3D.
Do tohoto adresáře nakopírujte adresáře class/, func/ a resources/ i s jejich obsahem a také soubory Captcha3D.php a Captcha3DCore.php.
V souboru ExamplePresenter.php se nachází příklad použití Captchi ve formuláři některého z vašich již existujících presenterů. Tento soubor nikam nekopírujte. Kdyžtak se můžete podívat dovnitř jak to funguje.
Soubor Captcha3DPresenterExample.php je příkladem presenteru na servírování obrázků, které captcha generuje. Přítomnost tohoto presenteru (resp. jeho kopie přejmenované na Captcha3DPresenter.php a třídy na MODULE_Captcha3DPresenter) je nutné v každé modulu v jehož presenterech je captcha použita. Alternativně lze poupravit kód captchi tak, aby byl tento presenter v některém known modulu v aplikaci pouze jediný – toto by ovšem vytvořilo závislost mezi moduly, proto je výhodnější presentery kopírovat.
Na začátek tovární metody formuláře (nebo někam do startupu BasePresenteru, pokud víme, že budeme Captchu používat často) umístíme kód k otestování existence třídy Captcha3D:

class_exists('Captcha3D');

Nebo alternativně i s vyhozením výjimky v případě neúspěchu:

if(!class_exists('Captcha3D')) // class_exists('Captcha3D') is required, becouse it forces RobotLoader to load Captcha3D class...
    throw new Exception('Unsatisfied Requirement: Captcha3D class not found!');

Tento kód přiměje RobotLoader k indexaci a requirnutí třídy s 3D Captchou, a extenzi jejího připojovátka do třídy formulářů.

Nyní je možné captchu připojovat do všech formulářů pomocí NFFFI.

Příklad použití

protected function createComponentForm($name) {
    if(!class_exists('Captcha3D')) // class_exists('Captcha3D') is required, becouse it forces RobotLoader to load Captcha3D class...
        throw new Exception('Unsatisfied Requirement: Captcha3D class not found!');

    $form = new AppForm();
    $form->addCaptcha3d('captcha', 'Antispam')
        ->addRule('Captcha3D::validateValid', 'Opište správně písmena z obrázku.');
    $form->addSubmit('send', 'Odeslat')
        ->onClick[] = array($this, 'formSubmitted');
    return $form;
}

Nastavení captchi

Parametry lze nastavit pomocí NFFFI pro každou instanci zvlášť, nebo přes statické proměnné globálně:

// soubor s použitým písmem
Captcha::$defaultFont = '%libsDir%/Captcha3D/resources/calibri.ttf';

// počet písmen v obrázku - 3D Captcha podporuje maximálně 5 znaků
Captcha::$defaultLength = 5;

// šířka obrázku v pixelech
Captcha::$defaultWidth = 200;

// výšku obrázku svěříme autodetekci
Captcha::$defaultHeight = 0;

// černý text
Captcha::$defaultTextColor = Image::rgb(0, 0, 0);

// na bílém pozadí
Captcha::$defaultBgColor = Image::rgb(255, 255, 255);

// v případě AppForm nastavíme masku odkazu na presenter obrázků
Captcha::$defaultLinkMask = 'Captcha3D:showCaptcha';

Po načtení třídy Captcha3D můžeme použít metodu Form::addCaptcha3d a provést nastavení pomocí NFFFI:

// class_exists("Captcha3D");

$form = new AppForm($this, 'captcha');
$form->addCaptcha3d('captcha', 'Antispam')
    ->setTextColor(Image::rgb(255, 0, 0))
    ->setBgColor(Image::rgb(0, 0, 255))
    ->addRule('Captcha3D::validateValid', 'Opište správně písmena z obrázku.');

Vykreslení captchi

Před vykreslením můžeme přistupovat k prototypům jednotlivých prvků:

// obalovací div
$container = $form['captcha']->getContainerPrototype();

// HTML element obrázku
$image = $form['captcha']->getImagePrototype();

// textovému poli přidáme třídu 'captcha'
$form['captcha']->getControlPrototype()->class('captcha');

Při postupném vykreslování formuláře lze obrázek a textové pole zpracovat zvlášť:

Obrázek: {!=$form['captcha']->getImage()}
Pole: {!=$form['captcha']->getInput()}

Obojí najednou: {!=$form['captcha']->getControl()}

Nebo jako widget v Nette Frameworku v0.9

{control form}

Obsah