Recaptcha
Zaczynamy od stworzenia sobie konta na recaptcha i dodajemy domenę na której nasz kod będzie używany. Jeśli nie zamierzamy udostępniać naszej aplikacji w internecie, to możemy wymyślić sobie tymczasową domeną, np. global-key.pl. Musimy tylko pamiętać aby zaznaczyć checkbox (Enable this key on all domains (global key)) dzięki któremu będziemy mogli korzystać z naczego klucza także na serwerach produkcyjnych czy testowych (takich jak localhost czy 127.0.0.1). Następnie klikamy Create Key.
Wszystko powinno wyglądać mniej więcej tak:
Do implementacji recaptcha będziemy potrzebowali biblioteki recaptcha4j-0.0.7.jar. Plik jar należy umieścić w katalogi WebContent\WEB-INF\lib lub w innym katalogu gdzie przechowujemy biblioteki dla naszej aplikacji.
Przygotowanie formularza
Kiedy mamy już wygenerowany prywatny i publiczny klucz, czas wstawić do formularza pola które będą przechowywać wartości recaptcha. Do tego celu użyjemy tego skryptu napisanego w JavaScript:
<script type="text/javascript" src="http://api.recaptcha.net/challenge?k=<your_public_key>"> </script> <noscript> <iframe src="http://api.recaptcha.net/noscript?k=<your_public_key>" height="300" width="500" frameborder="0"></iframe><br> <textarea name="recaptcha_challenge_field" rows="3" cols="40"> </textarea> <input type="hidden" name="recaptcha_response_field" value="manual_challenge"> </noscript>
W powyższym skrypcie wstawiamy nasz Public Key w miejsce <your_public_key> i tak przygotowany fragment kodu wklejamy do naszego formularza. U mnie wygląda to tak:
<?xml version="1.0" encoding="ISO-8859-1" ?> <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>Login</title> </head> <body> <form action="success" method="post"> <div> Value1: <input type="text" name="value1"/> </div> <div> Value2: <input type="text" name="value2"/> </div> <div> <script type="text/javascript" src="http://api.recaptcha.net/challenge?k=<publicKey>"> </script> <noscript> <iframe src="http://api.recaptcha.net/noscript?k=<publicKey>" height="300" width="500" frameborder="0"></iframe><br /> <textarea name="recaptcha_challenge_field" rows="3" cols="40"> </textarea> <input type="hidden" name="recaptcha_response_field" value="manual_challenge" /> </noscript> </div> <div> <input type="submit" value="Wyslij" /> </div> </form> </body> </html>
Brak komentarzy:
Prześlij komentarz