{"id":28444,"date":"2021-05-26T09:51:00","date_gmt":"2021-05-26T06:51:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=28444"},"modified":"2021-10-17T16:44:25","modified_gmt":"2021-10-17T13:44:25","slug":"como-agregar-no-soy-un-robot-captcha-en-laravel-forms","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/es\/como-agregar-no-soy-un-robot-captcha-en-laravel-forms\/","title":{"rendered":"C\u00f3mo agregar No soy un robot captcha en Laravel Forms"},"content":{"rendered":"

\u00bfEst\u00e1 buscando agregar Google reCAPTCHA en sus formularios de Laravel? Google reCAPTCHA ayuda a proteger los formularios contra los bots que resultan para salvarnos de los spam. Si no est\u00e1 protegiendo sus formularios, probablemente est\u00e9 recibiendo un mont\u00f3n de spam en la base de datos.<\/p>\n

En el momento de redactar este art\u00edculo, Google proporciona 2 versiones de reCAPTCHA: v2 y v3. El reCAPTCHA v3 coloca un icono en la esquina inferior derecha de sus p\u00e1ginas y verifican las solicitudes con una puntuaci\u00f3n. Por otro lado, reCAPTCHA v2 verifica las solicitudes con un desaf\u00edo. En este art\u00edculo, estudiamos reCAPTCHA v2 y validaremos las solicitudes con la casilla de verificaci\u00f3n "No soy un robot".<\/p>\n

\u00bfPor qu\u00e9 necesita Google reCAPTCHA?<\/h3>\n

Un bot de Internet es un sistema que ejecuta scripts automatizados en Internet. Apuntan a los formularios del sitio web para enviar spam a la base de datos. B\u00e1sicamente, este sistema funciona a un ritmo mucho m\u00e1s alto que los humanos por s\u00ed solos. Siempre queremos que un humano real interact\u00fae con los formularios de nuestro sitio web, no un bot.<\/p>\n

Al agregar Google reCAPTCHA, podemos proteger los formularios de nuestro sitio web contra estos robots de Internet, sus spam y abusos. Es imposible que un sistema automatizado resuelva el desaf\u00edo establecido por reCAPTCHA. Y su formulario no se enviar\u00e1 hasta que se resuelva el desaf\u00edo. Un humano puede resolver f\u00e1cilmente estos desaf\u00edos y enviar un formulario.<\/p>\n

Configure Google reCAPTCHA en su sitio web de Laravel<\/h3>\n

Para comenzar, primero debe registrar el sitio en Google<\/a>. Elija la opci\u00f3n reCAPTCHA v2 y la casilla de verificaci\u00f3n \u00abNo soy un robot" como se muestra en la captura de pantalla a continuaci\u00f3n.<\/p>\n

\"C\u00f3mo<\/a><\/p>\n

Al registrar el sitio, copie la clave del sitio y la clave secreta que necesitaremos en un momento.<\/p>\n

Tenemos que agregar reCAPTCHA en el proyecto Laravel. Para realizar la tarea, usar\u00e9<\/a> la biblioteca anhskohbo \/ no-captcha<\/a>.<\/p>\n

Abra el s\u00edmbolo del sistema en el directorio ra\u00edz de su proyecto y ejecute el comando:<\/p>\n

composer require anhskohbo\/no-captcha<\/code><\/pre>\n
Abra el archivo ‘config \/ app.php’ y agregue la siguiente l\u00ednea a la matriz de ‘proveedores’.<\/p>\n
AnhskohboNoCaptchaNoCaptchaServiceProvider::class,<\/code><\/pre>\n
Agregue un alias de clase a la matriz de alias:<\/p>\n
'NoCaptcha' => AnhskohboNoCaptchaFacadesNoCaptcha::class,<\/code><\/pre>\n
Publique el archivo de configuraci\u00f3n usando el comando:<\/p>\n
php artisan vendor:publish --provider=\"AnhskohboNoCaptchaNoCaptchaServiceProvider\"<\/code><\/pre>\n
A continuaci\u00f3n, abra el .env<\/code>archivo y especifique las claves reCAPTCHA de la siguiente manera.<\/p>\n
NOCAPTCHA_SECRET=secret-key\nNOCAPTCHA_SITEKEY=site-key<\/code><\/pre>\n
Aseg\u00farese de reemplazar los marcadores de posici\u00f3n secret-key, site-key con los valores reales.<\/p>\n
Borre la cach\u00e9 de configuraci\u00f3n ejecutando el siguiente comando.<\/p>\n
php artisan config:clear <\/code><\/pre>\n
Agregar Google reCAPTCHA al formulario en Laravel<\/h3>\n
En esta etapa, habr\u00e1 completado la configuraci\u00f3n b\u00e1sica requerida para reCAPTCHA. Ahora escribamos algo de c\u00f3digo y hag\u00e1moslo en acci\u00f3n.<\/p>\n
Abra su archivo de vista donde desea agregar la casilla de verificaci\u00f3n No soy un robot. En la parte superior del archivo blade, inicialice la fuente JS de la siguiente manera:<\/p>\n
{!! NoCaptcha::renderJs() !!}<\/code><\/pre>\n
Agregue la siguiente declaraci\u00f3n de una sola l\u00ednea en el lugar donde desea mostrar la casilla de verificaci\u00f3n reCAPTCHA. El mejor lugar es antes del bot\u00f3n de enviar.<\/p>\n
{!! NoCaptcha::display() !!}<\/code><\/pre>\n
Como ejemplo, creemos un formulario con pocos campos y agreguemos reCAPTCHA usando el c\u00f3digo siguiente.<\/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
Despu\u00e9s de agregar las l\u00edneas anteriores, ver\u00e1 que reCAPTCHA aparece como se muestra en la siguiente captura de pantalla.<\/p>\n
\"C\u00f3mo<\/a><\/p>\n
En el c\u00f3digo anterior, tambi\u00e9n agregu\u00e9 un c\u00f3digo que muestra un error si ocurre al validar un reCAPTCHA.<\/p>\n
Ahora, tenemos que validar el reCAPTCHA al enviar el formulario. Para lograr esto, usar\u00e9 Laravel Validator de la<\/a> siguiente manera.<\/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
Aqu\u00ed, he incluido la fachada ‘Validator’ y validando un reCAPTCHA en el m\u00e9todo ‘store’. Si no se valida, arrojar\u00e1 un error.<\/p>\n
\u00a1Eso es! Ha agregado correctamente reCAPTCHA v2 con la casilla de verificaci\u00f3n No soy un robot al formulario de Laravel. Ahora, su formulario no se enviar\u00e1 hasta que el visitante resuelva el desaf\u00edo reCAPTCHA.<\/p>\n
Art\u00edculos relacionados<\/h4>\n