Formularz z reCaptcha wbrew pozorom jest bardzo łatwy do wprowadzenia w skrypcie , poniżej przedstawimy skróconą instrukcję do napisania i uruchomienia w formularzu bez nerwów i poszukiwania w sieci informacji – podane wprost na talerzu.
Do działania potrzebujemy odpowiedniej biblioteki reCaptcha po stronie naszego serwera, którą można pobrać POD TYM LINKIEM. Klikamy zielony przycisk „clone or download” następnie pobieramy zip „master”. Po rozpakowaniu, w folderze src znajduje się plik autoload.php i folder ReCaptcha. Folder i plik kopiujemy do folderu gdzie znajduje się nasz główny skrypt z formularzem kontaktowym.
Na początku otwieramy znacznik PHP i dołączamy bibliotekę autoload.php
<?php require_once 'autoload.php';
Następnie określamy nasze klucze, publiczny i prywatny. Wygeneruj je spod tego linku lub przejdź do wpisu „reCAPTCHA instrukcja uzyskania kluczy” i podmień w podanym przykładzie. Język odbiorców naszego serwisu (choć już nie jest to tak do końca wymagany parametr).
$siteKey = '0000000000000000000000000000000000000000'; $secret = '1111111111111111111111111111111111111111'; $lang = 'pl';
Zamykamy znacznik PHP i rozpoczynamy html, wstawiamy sekcje nagłówkową dokumentu. W przykładzie użyjemy tylko tytuł strony i kodowanie.
?> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>Test reCAPTCHA</title> </head> <body>
Tworzymy warunek sprawdzający czy kod został wysłany i w zależności od tego czy został wysłany wyświetla nam komunikat o powodzeniu lub nie powodzeniu weryfikacji testu albo jeśli nie został wysłany to sam formularz ponownie.
<?php
if(isset($_POST['g-recaptcha-response']))
{
//formularz został wysłany
}
else
{
//formularz nie został wysłany
}
?>
Zamykamy dokument html
</body> </html>
Teraz zajmijmy się wyświetleniem naszego formularza zabezpieczonego reCaptcha. Utworzymy formularz z jednym polem tekstowym, przyciskiem zatwierdzenia, weryfikacją reCaptcha oraz dołączymy plik ze skryptem JavaScript od Google. Kod dołączający skrypty oraz weryfikację otrzymaliśmy po dodaniu strony w panelu Google z tym, że nieco zmodyfikujemy zabezpieczenie pobierając klucz publiczny ze zmiennej PHP, którą utworzyliśmy wcześniej.
if(isset($_POST['g-recaptcha-response']))
{
//formularz został wysłany
}
else
{
echo '
<form method="post">
<p>POdaj imie: <input type="text" name="Imię" value="test"></p>
<div class="g-recaptcha" data-sitekey="'.$siteKey.'"></div>
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl='.$lang.'">
</script>
<p><input type="submit" value="wyślij" /></p>
</form>
';
}
Sprawdzamy czy użytkownik nie jest robotem i przeszedł prawidłowo test. W tym celu stworzymy obiekt pobranej wcześniej klasy obsługującej API Google. Wyślemy za pomocą tego obiektu zawartość pola formularza a następnie przypiszemy wynik do zmiennej i wyświetlimy stosowny komunikat.
if(isset($_POST['g-recaptcha-response']))
{
//Tworzymy obiekt wykorzystując w tym celu nasz klucz prywatny zdefiniowany wcześniej
$recaptcha = new \ReCaptcha\ReCaptcha($secret);
//za pomocą stworzonego obiektu wysyłany otrzymane dane do Google i otrzymany wynik
$resp = $recaptcha->verify($_POST['g-recaptcha-response'], $_SERVER['REMOTE_ADDR']);
//warunek sprawdzający czy test został wykonany poprawnie
//zaś jeśli nie to o porażce
if($resp->isSuccess())
{
echo '<h2>Sukces!</h2><p>Przeszedłeś test.</p>';
}
else
{
echo '<h2>Coś poszło nie tak </h2><p>Wygląda na to że jesteś botem</p>';
}
}
else
{
echo '
<form method="post">
<p>POdaj imie: <input type="text" name="Imię" value="test"></p>
<div class="g-recaptcha" data-sitekey="'.$siteKey.'"></div>
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl='.$lang.'">
</script>
<p><input type="submit" value="wyślij" /></p>
</form>
';
}
Wysyłamy na hosting i wchodzimy na formularz z reCaptcha, powinniśmy uzyskać prosty formularz jak na obrazku poniżej. Po zaznaczeniu „nie jestem botem” trzeba chwilę odczekać i gotowe.
Gotowa zawartość pliku wygląda tak:
<?php
require_once 'autoload.php';
$siteKey = '0000000000000000000000000000000000000000';
$secret = '1111111111111111111111111111111111111111';
$lang = 'pl';
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Test reCAPTCHA</title>
</head>
<body>
<?php
if(isset($_POST['g-recaptcha-response']))
{
//Tworzymy obiekt wykorzystując w tym celu nasz klucz prywatny zdefiniowany wcześniej
$recaptcha = new \ReCaptcha\ReCaptcha($secret);
//za pomocą stworzonego obiektu wysyłany otrzymane dane do Google i otrzymany wynik
$resp = $recaptcha->verify($_POST['g-recaptcha-response'], $_SERVER['REMOTE_ADDR']);
//warunek sprawdzający czy test został wykonany poprawnie
//zaś jeśli nie to o porażce
if($resp->isSuccess())
{
echo '<h2>Sukces!</h2><p>Przeszedłeś test.</p>';
}
else
{
echo '<h2>Coś poszło nie tak </h2><p>Wygląda na to że jesteś botem</p>';
}
}
else
{
echo '
<form method="post">
<p>POdaj imie: <input type="text" name="Imię" value="test"></p>
<div class="g-recaptcha" data-sitekey="'.$siteKey.'"></div>
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl='.$lang.'">
</script>
<p><input type="submit" value="wyślij" /></p>
</form>
';
}
?>
</body>
</html>
