{"id":28477,"date":"2021-05-26T09:48:00","date_gmt":"2021-05-26T06:48:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=28477"},"modified":"2021-10-18T03:41:53","modified_gmt":"2021-10-18T00:41:53","slug":"jak-dodac-nie-jestem-robotem-captcha-w-laravel-forms","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/pl\/jak-dodac-nie-jestem-robotem-captcha-w-laravel-forms\/","title":{"rendered":"Jak doda\u0107 Nie jestem robotem captcha w Laravel Forms"},"content":{"rendered":"

Czy chcesz doda\u0107 Google reCAPTCHA do swoich formularzy Laravel? Google reCAPTCHA pomaga chroni\u0107 formularze przed botami, kt\u00f3re w rezultacie chroni\u0105 nas przed spamem. Je\u015bli nie chronisz swoich formularzy, prawdopodobnie dostajesz mn\u00f3stwo spamu do bazy danych.<\/p>\n

W chwili pisania tego tekstu Google udost\u0119pnia 2 wersje reCAPTCHA \u2013 v2 i v3. ReCAPTCHA v3 umieszcza ikon\u0119 w prawym dolnym rogu twoich stron i weryfikuje \u017c\u0105dania za pomoc\u0105 wyniku. Z drugiej strony reCAPTCHA v2 weryfikuje \u017c\u0105dania za pomoc\u0105 wyzwania. W tym artykule przyjrzymy si\u0119 reCAPTCHA v2 i zweryfikujemy \u017c\u0105dania za pomoc\u0105 pola wyboru \u201eNie jestem robotem".<\/p>\n

Dlaczego potrzebujesz Google reCAPTCHA?<\/h3>\n

Bot internetowy to system, kt\u00f3ry uruchamia automatyczne skrypty w Internecie. Ich celem jest wysy\u0142anie spamu do bazy danych z formularzy witryn internetowych. Zasadniczo ten system dzia\u0142a znacznie szybciej ni\u017c sami ludzie. Zawsze chcemy, aby w kontakt z naszymi formularzami internetowymi wchodzi\u0142 prawdziwy cz\u0142owiek, a nie bot.<\/p>\n

Dodaj\u0105c Google reCAPTCHA, mo\u017cemy chroni\u0107 formularze naszej witryny przed tymi botami internetowymi, ich spamem i nadu\u017cyciami. Zautomatyzowany system nie jest w stanie sprosta\u0107 wyzwaniu postawionemu przez reCAPTCHA. Tw\u00f3j formularz nie zostanie przes\u0142any, dop\u00f3ki wyzwanie nie zostanie rozwi\u0105zane. Cz\u0142owiek mo\u017ce \u0142atwo rozwi\u0105za\u0107 te wyzwania i z\u0142o\u017cy\u0107 formularz.<\/p>\n

Skonfiguruj Google reCAPTCHA na swojej stronie Laravel<\/h3>\n

Aby rozpocz\u0105\u0107, musisz najpierw zarejestrowa\u0107 witryn\u0119 w Google<\/a>. Wybierz opcj\u0119 reCAPTCHA v2 i pole wyboru \u201eNie jestem robotem”, jak pokazano na zrzucie ekranu poni\u017cej.<\/p>\n

\"Jak<\/a><\/p>\n

Po zarejestrowaniu strony skopiuj klucz strony i tajny klucz, kt\u00f3rych b\u0119dziemy potrzebowa\u0107 za chwil\u0119.<\/p>\n

Musimy doda\u0107 reCAPTCHA w projekcie Laravel. Do wykonania zadania u\u017cyj\u0119<\/a> biblioteki anhskohbo\/no-captcha<\/a>.<\/p>\n

Otw\u00f3rz wiersz polece\u0144 w katalogu g\u0142\u00f3wnym swojego projektu i uruchom polecenie:<\/p>\n

composer require anhskohbo\/no-captcha<\/code><\/pre>\n
Otw\u00f3rz plik 'config\/app.php’ i dodaj poni\u017cszy wiersz do tablicy 'providers’.<\/p>\n
AnhskohboNoCaptchaNoCaptchaServiceProvider::class,<\/code><\/pre>\n
Dodaj alias klasy do tablicy alias\u00f3w:<\/p>\n
'NoCaptcha' => AnhskohboNoCaptchaFacadesNoCaptcha::class,<\/code><\/pre>\n
Opublikuj plik konfiguracyjny za pomoc\u0105 polecenia:<\/p>\n
php artisan vendor:publish --provider=\"AnhskohboNoCaptchaNoCaptchaServiceProvider\"<\/code><\/pre>\n
Nast\u0119pnie otw\u00f3rz .env<\/code>plik i okre\u015bl klucze reCAPTCHA w nast\u0119puj\u0105cy spos\u00f3b.<\/p>\n
NOCAPTCHA_SECRET=secret-key\nNOCAPTCHA_SITEKEY=site-key<\/code><\/pre>\n
Pami\u0119taj, aby zast\u0105pi\u0107 symbole zast\u0119pcze tajny klucz, klucz witryny rzeczywistymi warto\u015bciami.<\/p>\n
Wyczy\u015b\u0107 pami\u0119\u0107 podr\u0119czn\u0105 konfiguracji, uruchamiaj\u0105c poni\u017csze polecenie.<\/p>\n
php artisan config:clear <\/code><\/pre>\n
Dodanie Google reCAPTCHA do formularza w Laravel<\/h3>\n
Na tym etapie ko\u0144czysz podstawow\u0105 konfiguracj\u0119 wymagan\u0105 do reCAPTCHA. Teraz napiszmy troch\u0119 kodu i zr\u00f3bmy go w akcji.<\/p>\n
Otw\u00f3rz plik widoku, w kt\u00f3rym chcesz doda\u0107 pole wyboru Nie jestem robotem. W g\u00f3rnej cz\u0119\u015bci pliku blade zainicjuj \u017ar\u00f3d\u0142o JS w nast\u0119puj\u0105cy spos\u00f3b:<\/p>\n
{!! NoCaptcha::renderJs() !!}<\/code><\/pre>\n
Dodaj poni\u017csz\u0105 jednowierszow\u0105 instrukcj\u0119 w miejscu, w kt\u00f3rym chcesz wy\u015bwietli\u0107 pole wyboru reCAPTCHA. Najlepsze miejsce jest przed przyciskiem przesy\u0142ania.<\/p>\n
{!! NoCaptcha::display() !!}<\/code><\/pre>\n
Jako przyk\u0142ad stw\u00f3rzmy formularz z kilkoma polami i dodajmy do niego reCAPTCHA za pomoc\u0105 poni\u017cszego kodu.<\/p>\n
{!! NoCaptcha::renderJs() !!}\n\u00a0\n@if ($errors->has('g-recaptcha-response'))\n\u00a0\u00a0\u00a0\u00a0<span class=\"help-block\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<strong>{{ $errors->first('g-recaptcha-response') }}<\/strong>\n\u00a0\u00a0\u00a0\u00a0<\/span>\n@endif\n<form action=\"{{ url('ROUTE_HERE') }}\" method=\"post\">\n\u00a0\u00a0\u00a0\u00a0<p>Name: <input type=\"text\" name=\"fullname\" \/><\/p>\n\u00a0\u00a0\u00a0\u00a0<p>Email: <input type=\"email\" name=\"email\" \/><\/p>\n\u00a0\u00a0\u00a0\u00a0<p>Message: <textarea name=\"message\"><\/textarea><\/p>\n\u00a0\u00a0\u00a0\u00a0{!! NoCaptcha::display() !!}\n\u00a0\u00a0\u00a0\u00a0{{ csrf_field() }}\n\u00a0\u00a0\u00a0\u00a0<p><input type=\"submit\" name=\"submit\" value=\"Submit\" \/><\/p>\n<\/form><\/code><\/pre>\n
Po dodaniu powy\u017cszych linii zobaczysz, \u017ce reCAPTCHA pojawi si\u0119, jak pokazano na poni\u017cszym zrzucie ekranu.<\/p>\n
\"Jak<\/a><\/p>\n
W powy\u017cszym kodzie doda\u0142em r\u00f3wnie\u017c kod, kt\u00f3ry wy\u015bwietla b\u0142\u0105d, je\u015bli wyst\u0105pi podczas walidacji reCAPTCHA.<\/p>\n
Teraz musimy zweryfikowa\u0107 reCAPTCHA podczas przesy\u0142ania formularza. Aby to osi\u0105gn\u0105\u0107, u\u017cyj\u0119 Laravel Validator<\/a> w nast\u0119puj\u0105cy spos\u00f3b.<\/p>\n
<?php\n\u00a0\nnamespace AppHttpControllers;\n\u00a0\nuse IlluminateHttpRequest;\nuse IlluminateSupportFacadesValidator;\n\u00a0\nclass ContactController extends Controller\n{\n\u00a0\u00a0\u00a0\u00a0...\n\u00a0\u00a0\u00a0\u00a0...\n\u00a0\u00a0\u00a0\u00a0public function store(Request $request)\n\u00a0\u00a0\u00a0\u00a0{\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$messages = [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'g-recaptcha-response.required' => 'You must check the reCAPTCHA.',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'g-recaptcha-response.captcha' => 'Captcha error! try again later or contact site admin.',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0];\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$validator = Validator::make($request->all(), [\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'g-recaptcha-response' => 'required|captcha'\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0], $messages);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if ($validator->fails()) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return redirect('ROUTE_HERE')\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0->withErrors($validator)\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0->withInput();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ process the form\n\u00a0\u00a0\u00a0\u00a0}\u00a0\u00a0 \n}<\/code><\/pre>\n
Tutaj umie\u015bci\u0142em fasad\u0119 'Validator’ i walidacj\u0119 reCAPTCHA w metodzie 'store’. Je\u015bli nie uda si\u0119 zweryfikowa\u0107, zg\u0142osi b\u0142\u0105d.<\/p>\n
Ot\u00f3\u017c \u200b\u200bto! Pomy\u015blnie doda\u0142e\u015b reCAPTCHA v2 z polem wyboru Nie jestem robotem do formularza Laravel. Teraz Tw\u00f3j formularz nie zostanie przes\u0142any, dop\u00f3ki odwiedzaj\u0105cy nie rozwi\u0105\u017ce wyzwania reCAPTCHA.<\/p>\n
Powi\u0105zane artyku\u0142y<\/h4>\n