La validación de Captcha es extremadamente importante para proteger el envío amable del remitente. Nos ayuda a proteger los envíos de tipo engañoso a nuestro sitio web por parte de los bots. Existen varias soluciones captcha para reducir el envío de tipo spam. De estos, Google reCaptcha es más seguro, confiable y lo más importante es que es gratis. Si está buscando cómo agregar Google reCaptcha en su sitio web, este artículo es útil para usted. En este artículo, aprendemos, utilizando el marco de trabajo de laravel, cómo agregar Google reCaptcha sin agregar la instalación de un paquete externo.
Pasos para la validación de Google reCaptcha en laravel: a continuación se muestran algunos pasos que podemos seguir para usar Google reCaptcha sin paquete:
- Crear una regla de validación personalizada
- Crear clase Recaptcha
- Generar clave de sitio y clave secreta
- Archivo Update.env en su proyecto
- Crear archivo de vista
- Validación de Google reCaptcha
1. Cree una regla de validación personalizada: de forma predeterminada, laravel tiene muchas más reglas de validación, pero no hay una regla para la validación de Google reCaptcha. Pero usando un comando podemos crear una regla de validación personalizada simple para Google reCaptcha. Al usar el siguiente comando, creamos nuestra regla de validación personalizada
php artisan make:rule Recaptcha
2. Crear clase de Recaptcha: después de ejecutar con éxito este comando, la clase de reCaptcha se creará en el directorio de reglas/aplicación de la ruta . Luego escriba el siguiente código en el archivo de clase reCaptcha. Lo importante es que este código se puede reutilizar en su próximo proyecto.
PHP
<? php
namespace App\Rules;
use Illuminate\Contracts\Validation\Rule;
class Recaptcha implements Rule {
public function __construct() {
}
public function passes($attribute, $value) {
$data = array('secret' => env('GOOGLE_RECAPTCHA_SECRET'),
'response' => $value);
try {
$verify = curl_init();
curl_setopt($verify, CURLOPT_URL,
"https://www.google.com/recaptcha/api/siteverify");
curl_setopt($verify, CURLOPT_POST, true);
curl_setopt($verify, CURLOPT_POSTFIELDS,
http_build_query($data));
curl_setopt($verify, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($verify, CURLOPT_RETURNTRANSFER, true);
$response = curl_exec($verify);
return json_decode($response) -> success;
}
catch (\Exception $e) {
return false;
}
}
public function message() {
return 'ReCaptcha verification failed.';
}
}
?>
3. Genere la clave del sitio y la clave secreta: Haga clic en Google recapturar y obtendrá un formulario similar a una página, como se muestra en la siguiente imagen:
Formulario reCaptcha de Google
Al agregar su sitio y detalles, obtendrá la clave de su sitio web y la clave secreta. Guarde esa clave en el bloc de notas de su dispositivo para continuar con el proceso.
4. Actualice el archivo .env: actualice el archivo .env de su proyecto con una clave secreta y una clave de sitio (Nota: agregue su propia clave de sitio y clave secreta, que se guarda en su bloc de notas).
GOOGLE_RECAPTCHA_KEY=<site key> GOOGLE_RECAPTCHA_SECRET=<secret key>
5. Cree un archivo de vista: cree un archivo de vista o hoja para escribir el código donde desea la protección de validación de Google reCaptcha. Puede utilizar este código en cualquier formulario que desee enviar de forma segura.
HTML
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width,
initial-scale=1, shrink-to-fit=no">
<!-- CSS -->
<link rel="stylesheet" href=
"https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://www.google.com/recaptcha/api.js"
async defer></script>
</head>
<body>
<div class="container mt-5">
<div class="card">
<div class="card-header text-center">
Google reCaptcha </div>
<div class="card-body">
<form action="validate-captcha.php"
method="post">
<div class="form-group">
<label for="exampleInputEmail1">
First Name</label>
<input type="text" name="name"
class="form-control" id="name"
required="">
</div>
<div class="form-group">
<label for="exampleInputEmail1">
Email </label>
<input type="email" name="email"
class="form-control" id="email"
aria-describedby="emailHelp"
required="">
</div>
<div class="form-group">
<label for="exampleInputEmail1">
Password</label>
<input type="password" name="password"
class="form-control" id="password"
required="">
</div>
<div class="form-group">
<label for="exampleInputEmail1">
Confirm Password</label>
<input type="password" name="cpassword"
class="form-control" id="cpassword"
required="">
</div>
<label>
<input type="checkbox" name="remember"
style="margin-bottom:15px">
I Accepts terms and conditions
</label>
<script src="https://www.google.com/recaptcha/api.js"
async defer></script>
<div class="g-recaptcha" id="feedback-recaptcha"
data-sitekey="{{ env('GOOGLE_RECAPTCHA_KEY') }}">
</div>
<input type="submit" name="password-reset-token"
class="btn btn-primary">
</form>
</div>
</div>
</div>
</body>
</html>
6. Validación de Google reCaptcha: en el paso final, agregamos una regla de validación personalizada en la ruta app\Rules\GoogleRecaptcha. Agregue el siguiente código a su archivo.
PHP
public function postContactForm(Request $request) {
$this -> validate($request, [
'g-recaptcha-response' =>
['required', new Recaptcha()]]);
// Recaptcha passed, do what ever you need
}
Producción:
Producción
Publicación traducida automáticamente
Artículo escrito por jyotsnarasam y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA