Implementace Google reCAPTCHA

Google reCAPTCHA je služba společnosti Google, která chrání formuláře před spamem a automatizovaným zneužitím — vyhodnocuje chování návštěvníka a odlišuje tak skutečného uživatele od robota. V NET Geniu se používá k ochraně veřejných formulářů, tedy formulářů přístupných anonymním uživatelům (kontaktní formulář, poptávka, registrace).

Ochrana se skládá vždy ze dvou částí: ovládací prvek HTML vloží do formuláře ověřovací kód serverovou funkcí „GOOGLECAPTCHA“ nebo „GOOGLECAPTCHAINVISIBLE“ a skript tlačítka odpověď ověří na straně serveru serverovou funkcí „EVALGOOGLECAPTCHA“. Bez druhé části je ochrana pouze zdánlivá — robot, který formulář odešle bez interakce se službou Google, není nijak zastaven.

NET Genium podporuje klíče typu Challenge (v2) a Invisible (v2). Výsledkem ověření je pouze informace, zda kontrola prošla, nebo neprošla. Klíče typu score (reCAPTCHA v3), které vracejí číselné vyjádření pravděpodobnosti, že formulář odeslal člověk, podporovány nejsou.

Zastaralá funkce „CAPTCHA“ (ověřovací kód vykreslený do obrázku) se pro nové implementace nepoužívá — automatizované nástroje ji čtou s vysokou úspěšností a pro uživatele se zrakovým postižením je nepřístupná.

1. Dvě varianty ochrany

• Invisible reCAPTCHA badge — kontrola proběhne „neviditelně“ na pozadí stránky, bez jakékoli interakce uživatele. Ve formuláři se zobrazí pouze odznak služby v rohu okna. Implementace vyžaduje dvě tlačítka — viditelné tlačítko, které kontrolu spustí, a skryté tlačítko, které po odpovědi od Googlu provede ověření na serveru.
• Google reCAPTCHA „I'm not a robot“ Checkbox — uživatel zaškrtne políčko „Nejsem robot“. Implementace vyžaduje jedno tlačítko, ve kterém se ověření provede.

Typ ochrany se volí už při vytváření klíčů (viz následující kapitola) — klíč vytvořený pro jednu variantu nelze použít pro druhou.

2. Vytvoření klíčů pro Google reCAPTCHA

Pro vytvoření klíčů je potřeba mít založený účet Google. Prvních 10 000 ověření za měsíc je podle aktuálního ceníku společnosti Google bezplatných, po překročení limitu se účtují poplatky.

1. Otevřete stránku https://console.cloud.google.com/projectselector2/security/recaptcha a přihlaste se svým účtem Google.
2. Nemáte-li dosud vytvořený projekt, vytvořte ho tlačítkem „Create project“. Jinak vyberte projekt, ve kterém chcete klíč vytvořit.
3. Klikněte na tlačítko „Create key“ a vyplňte formulář:
   1. „Display name“ — nejlépe název domény (například www.netgenium.com)
   2. „Application type“ — zvolte „Web“
   3. tlačítkem „Add domain“ přidejte doménu (například www.netgenium.com)
4. Podle požadované varianty ochrany:
   1. Invisible badge — klikněte na „Create key“
   2. „I'm not a robot“ Checkbox — klikněte na „Next step (optional)“, zaškrtněte „Will you use challenges?“ a teprve pak klikněte na „Create key“
5. Ze záhlaví vytvořeného klíče si zkopírujte „Site key“ — je uvedený za textem „ID:“.
6. Na záložce „Integration“ klikněte na „Integrate with a third-party service or plugin“ a z vyskakovacího okna si zkopírujte „Secret key“.
7. Oba klíče si uložte — „Site key“ se zapisuje do ovládacího prvku HTML, „Secret key“ do skriptu tlačítka.

Klíč „Secret key“ není nikde jinde v konzoli vidět — nabídne ho jedině vyskakovací okno na záložce „Integration“.

3. Implementace Invisible reCAPTCHA badge

3.1. Tlačítko, které spouští kontrolu

• V editačním formuláři vytvořte nový ovládací prvek „Button“.
• Na záložce „Obecné“ zadejte název tlačítka, například „Poslat dotaz“.
• Na záložce „Událost“ vepište do pole „Klient“ javascriptovou funkci „evalGoogleCaptcha();“ a tlačítko uložte.

Stisknutím tlačítka uživatel vyvolá kontrolu službou Google, která vrátí odpověď s informací, zda jde o robota, či nikoli.

3.2. Skryté tlačítko, které odpověď ověří na serveru

• Vytvořte druhý ovládací prvek „Button“.
• Na záložce „Obecné“ zadejte název tlačítka, například „Poslat dotaz – krok 2“, zaškrtněte „Skryté tlačítko“ a tlačítko uložte.
• Na záložce „Událost“ zaškrtněte „Skript“ a klikněte na „Upravit skript“.
• Na první řádek skriptu vložte komentář a zapište do něj volání funkce „EVALGOOGLECAPTCHA“ s vaším klíčem „Secret key“ a s chybovou zprávou.

EVALGOOGLECAPTCHA(6Lda_JIUAAAAANloD9-zLrfSHkyeAR3wBLbrqLQI, "Sorry, we think you're a robot...")

• Za tento řádek doplňte další kroky skriptu, které se mají provést po úspěšném ověření — odeslání e-mailu, poděkování a podobně. Neprojde-li ověření, skript se přeruší chybovou zprávou a další kroky se neprovedou.

Funkce „EVALGOOGLECAPTCHA“ se vyhodnotí pouze na řádku typu komentář. Zapsaná na jiném řádku skriptu se neprovede a formulář zůstane bez ochrany.

3.3. Vložení funkce GOOGLECAPTCHAINVISIBLE

• Vytvořte nový ovládací prvek „HTML“.
• Na záložce „Obecné“ zapište volání funkce „GOOGLECAPTCHAINVISIBLE“ s vaším klíčem „Site key“ a s identifikátorem skrytého tlačítka z předchozího kroku.

GOOGLECAPTCHAINVISIBLE(6Lda_JIUAAAAAMaSHupdzEhcvAmz06oMZ1Qm4yoV, BT216)

Identifikátor tlačítka má tvar „BT“ a databázové ID tlačítka; ID zjistíte, když najedete kurzorem myši na ikonu tužky („Upravit Button“) u příslušného tlačítka. Skryté tlačítko spouští NET Genium samo po přijetí odpovědi od Googlu.

Funkce má ještě dva volitelné parametry — adresu skriptu služby (výchozí je „https://www.recaptcha.net/recaptcha/api.js“, což je adresa dostupná i v sítích blokujících doménu google.com) a umístění odznaku s hodnotami „bottomright“, „bottomleft“ a „inline“.

4. Implementace „I'm not a robot“ Checkbox

4.1. Vložení funkce GOOGLECAPTCHA

• V editačním formuláři vytvořte nový ovládací prvek „HTML“.
• Na záložce „Obecné“ zapište volání funkce „GOOGLECAPTCHA“ s vaším klíčem „Site key“.

GOOGLECAPTCHA(6LemsJMUAAAAAECVTRA6PGMVjtFLXlxT7e4mIwqd)

Volitelným druhým parametrem je adresa skriptu služby; není-li uvedena, použije se „https://www.google.com/recaptcha/api.js“.

4.2. Tlačítko, které odpověď ověří na serveru

• Vytvořte nový ovládací prvek „Button“ a na záložce „Obecné“ zadejte jeho název, například „Poslat dotaz“.
• Na záložce „Událost“ zaškrtněte „Skript“ a klikněte na „Upravit skript“.
• Na první řádek skriptu vložte komentář a zapište do něj volání funkce „EVALGOOGLECAPTCHA“ s vaším klíčem „Secret key“ a s chybovou zprávou.

EVALGOOGLECAPTCHA(6LemsJMUAAAAAMNjeaAq5Zn-vKnVTK0WeloxKrgu, Nezaškrtli jste pole CAPTCHA)

• Za tento řádek doplňte další kroky skriptu, které se mají provést po úspěšném ověření.

Na rozdíl od varianty Invisible se zde vystačí s jediným tlačítkem — zaškrtnutím políčka „Nejsem robot“ proběhne kontrola ještě před odesláním formuláře.

5. Provoz a ladění

• Neúspěšné pokusy se zapisují do logu „Warnings“ v adresáři „Logs“ dané instance NET Genia (například „C:\inetpub\wwwroot\netgenium\Logs“). Záznam obsahuje použitý klíč „Secret key“, uživatele, adresu stránky a důvod — chybějící odpověď od služby (u varianty Invisible se zapíše evalGoogleCaptcha(); was not called, u varianty Checkbox I am not a robot was not clicked), nebo chybu vrácenou ověřovacím endpointem.
• V testovacím režimu návrháře skriptů se ověření neprovádí — tlačítko „Spustit skript“ funkci „EVALGOOGLECAPTCHA“ přeskočí. Ochranu proto vždy vyzkoušejte odesláním skutečného formuláře.
• Selže-li spojení s ověřovacím endpointem („https://www.google.com/recaptcha/api/siteverify“), skript se přeruší toutéž chybovou zprávou jako při neúspěšném ověření a podrobnost se zapíše do logu „Warnings“.
• Je-li server za proxy serverem, zadejte jeho adresu jako třetí, volitelný parametr funkce „EVALGOOGLECAPTCHA“ — ověřovací požadavek pak jde přes něj.

EVALGOOGLECAPTCHA(6LemsJMUAAAAAMNjeaAq5Zn-vKnVTK0WeloxKrgu, Nezaškrtli jste pole CAPTCHA, http://proxy:8080)

6. Administrace vytvořených klíčů

1. Otevřete stránku https://console.cloud.google.com/projectselector2/security/recaptcha a přihlaste se účtem Google, pod kterým jste klíče vytvořili.
2. Otevřete projekt, ve kterém jste klíče vytvořili, a sjeďte na sekci „reCAPTCHA keys“.
3. Tlačítkem „Key details“ otevřete detail klíče — uprostřed je graf se statistikou využívání a v pravém horním rohu tlačítka „Edit key“ a „Delete this key“ pro úpravu nebo smazání klíče.

Detailní popis serverových funkcí „GOOGLECAPTCHA“, „GOOGLECAPTCHAINVISIBLE“ a „EVALGOOGLECAPTCHA“ je uveden v samostatné příručce Serverové funkce.