Jak přidat reCAPTCHA do přihlašovacího formuláře

Po založení nového WordPress webu nám bez dostatečného zabezpečení hrozí spam a automatizované útoky botů, kteří se snaží získat přístup do naší administrace. Tím nejznámějším útokem je tzv. „brute force login attack“, který má seznam náhodných jmen a hesel, pomocí kterého se snaží přihlásit do našeho WordPressu přes přihlašovací formulář.

Po chvíli zkoušení by byl bot zablokován na základě IP adresy pomocí některého z pluginů, nebo díky hostingu. Proto útočník provádí útoky z co nejvíce (většinou kradených) serverů(majitelé webů většinou nic netuší) a z co nejvíce lokalit pro zvýšení úspěšnosti napadení a pro minimální procento odhalení.

Z toho důvodu bychom nikdy neměli nechávat defaultní jméno uživatele po založení WordPressu, a změnit jej na jiné. Nabízí se spousta způsobů ochrany, jejichž souhrn najdete zde(Velký průvodce bezpečností WordPressu). V tomto článku se však podrobněji zaměříme na Google reCaptcha, pomocí něhož jsme schopni jednoduše a efektivně zabránit potencionálním útokům.

Co je to reCAPTCHA

Je nezpoplatněná služba od Google, která chrání webové stránky proti spamu a zneužití. „CAPTCHA“ je tzv. Turingův test, který by měl zjistit, jestli je uživatelem člověk, nebo umělá inteligence. Službu reCAPTCHA můžeme jednoduše a zdarma přidat i na naše webové stránky. Google reCAPTCHA nabízí hned několik verzí, z nichž si uvedeme dvě nejpopulárnější.

Google reCAPTCHA v2

Funguje na základě ověření uživatelem. Jsou dva způsoby interakce:

1. Zaškrtávací políčko „Nejsem robot“, kde uživatelé jednoduše kliknou na zaškrtávací políčko k potvrzení, že nejsou roboti
2. V tomto případě není nutná přímá interakce s uživatelem, který pouze klikne na existující tlačítko(nebo pomocí JS API) na webu, které na pozadí spustí reCAPTCHA.

Nevýhody

• Horší UX(uživatelská přívětivost)

Google reCAPTCHA v3

Novější v3 je již uživatelsky přívětivější, protože běží na pozadí. Používá bodovací systém, díky kterému vyhodnocuje riziko a vrací rizikové skóre(0.0 až 1.0), podle kterého s velkou mírou přesnosti rozezná člověka od bota.

Nevýhody

• Omezené možnosti přizpůsobení
• Nekompatibilita se staršími verzemi prohlížečů
• Může někdy identifikovat skutečné uživatele jako robota a způsobit tak špatné uživatelské zkušenosti.

Google reCAPTCHA pro WordPress

Možností, jak službu reCAPTCHA integrovat s naším WordPress webem je opravdu mnoho. Existuje nespočet dostupných pluginů. Uvedeme si jeden z těch nejpopulárnějších + řešení pomocí vlastního kódu(pro pokročilejší uživatele).

reCAPTCHA pro WordPress přihlašovací stránku – řešení pomocí pluginu „Advanced Google reCAPTCHA“

Advanced Google reCAPTCHA

V administraci WordPressu přejdeme do sekce Pluginy > Přidat nový plugin, kde nainstalujeme a aktivujeme plugin „Advanced Google reCAPTCHA„, který nabízí základní funkce zdarma(pro naše účely to bude bohatě stačit).

Jak postupovat:

1. Dle našich priorit zvolíme Google reCAPTCHA v2, nebo v3
2. Vložíme námi vygenerované klíče(podrobný postup při generování klíčů najdete v článku „Jak získat klíče pro Google reCAPTCHA“)
3. Po přidání klíčů je i ověříme pomocí pole „Verify Captcha“
4. Na výběr máme zdarma hned několik různých druhů zabezpečení, zvolíme jeden z nich
5. Uložíme změny a otestujeme funkčnost(Odhlásíme se z administrace a přejdeme na přihlašovací stránku webu, kde by se již mělo zobrazovat okno Google reCAPTCHA)

Příklad dvou různých voleb zabezpečení dostupných ve FREE verzi pluginu:

reCAPTCHA v2 pro WordPress přihlašovací stránku – řešení pomocí kódu

Pro implementaci Google reCAPTCHA v2 pro náš WordPress web musíme vygenerovat klíče, které budeme dále potřebovat. Klíče můžeme vygenerovat na oficiálních stránkách Google reCAPTCHA.

Podrobný návod na generování klíčů najdete v článku „Jak získat klíče pro Google reCAPTCHA“.

Pokud již máme klíče vygenerované, přejdeme do administrace našeho WordPressu a vkročíme do sekce Nástroje > Editor souboru šablony. Zde zvolíme možnost „Funkce šablony(functions.php)„. Sjedeme až na úplný konec, kam vložíme následující kód, do kterého pouze přidáme vygenerované klíče na označená místa:

/*PŘIDÁNÍ GOOGLE RECAPTCHA V2*/

function secure_authentication_login_form() {
 ?>
 <script src="https://www.google.com/recaptcha/api.js"></script>
 <div class="g-recaptcha" data-sitekey="ZDE VLOŽÍME SITE_KEY"></div>
 <?php
}
add_action( 'login_form', 'secure_authentication_login_form' );
add_action( 'login_form_middle', 'secure_authentication_login_form' );
function secure_authentication_login_verify( $user, $username ) {
 $secret_key = 'ZDE VLOŽÍME SECRET_KEY';
 if ( isset( $_POST['g-recaptcha-response'] ) ) {
 $recaptcha_response = $_POST['g-recaptcha-response'];
 $url = 'https://www.google.com/recaptcha/api/siteverify';
 $data = array(
 'secret' => $secret_key,
 'response' => $recaptcha_response,
 );
 $options = array(
 'http' => array(
 'header' => "Content-type: application/x-www-form-urlencoded\r\n",
 'method' => 'POST',
 'content' => http_build_query( $data ),
 ),
 );
 $context = stream_context_create( $options );
 $result = file_get_contents( $url, false, $context );
 $result = json_decode( $result );
 if ( ! $result->success ) {
 // If the reCAPTCHA response is invalid, return an error
 $error = new WP_Error();
 $error->add( 'recaptcha_error', __( '<strong>ERROR</strong>: Invalid reCAPTCHA response.' )
);
 return $error;
 }
 } else {
 // If the reCAPTCHA field is not present, return an error
 $error = new WP_Error();
 $error->add( 'recaptcha_error', __( '<strong>ERROR</strong>: reCAPTCHA is required.' ) );
 return $error;
 }
 return $user;
}
add_filter( 'wp_authenticate_user', 'secure_authentication_login_verify', 10, 2 );

Po přidání kódu a nastavení klíčů nesmíme zapomenout „Aktualizovat soubor“- Pokud jsme vše nastavili správně, můžeme si to vyzkoušet např. v anonymním režimu(CTRL+SHIFT+N). Dále už pouze přejdeme na přihlašovací stránku do administrace webu, kde by se již mělo ukazovat okno Google reCAPTCHA.

Závěr

Přidání reCAPTCHA do přihlašovacího formuláře WordPressu je důležitým krokem k ochraně webu před spamem a automatizovanými útoky botů. Integrace reCAPTCHA, ať už v2 nebo v3 s naším webem, přináší řadu výhod.

Bezpečnost webu je klíčová, a proto bychom měli přidat tuto vrstvu ochrany k přihlašovacímu procesu i pro náš web. Kompletní přehled o tom, jak zabezpečit WordPress web najdete v článku „Velký průvodce bezpečnosti WordPressu„.