Los formularios son una parte importante de practicamente cualquier aplicaciones web; de muchas formas, en la manera por excelencia que se tiene para interactuar con el usuario, ya sea para crear o editar datos, usarlos como filtros, en un paso por paso y un largo etc.
Los formularios en Laravel, pueden ser directamente un formulario en HTML clásico y agregando la protección de CSRF y poco más.
El manejo de formularios en Laravel también incluye la validación de los datos enviados por el usuario; para esto, se emplean clases adicionales generadas mediante artisan en la cual, tenemos una serie de métodos predefinidos listos para usar o podemos crear las propias; estas validaciones son fundamentales ya que, siempre hay que generar validaciones del lado del servidor.
Laravel proporciona una sintaxis clara y muy potente para definir reglas de validación ya sea a nivel de los controladores o como es clásico, en clases aparte que luego inyectamos en el controlador o netamente referenciamos, con esto, siempre nos aseguramos de que los datos recibidos por el servidor sean correctos.
En esta entrada vamos a aprender a procesar un formulario en Laravel de manera básica, enviar el mismo, consumir los datos desde una función tipo Post y mostrar una página de respuesta; este es el funcionamiento común cuando estamos trabajando con formularios que se encarga de procesar y recibir datos por parte del usuario con el propósito de almacenar los mimos en la base de datos.
En esta entrada seguiremos trabajando con los controladores, rutas y las vistas; por lo que será una entrada similar a la que ya tratamos anteriormente; pero vamos a ir un paso más allá y vamos a trabajar un poco con los formularios para poder enviar información o datos a nuestro controlador y luego poder imprimirlos en la vista; así que vamos a ello.
Crear función y ruta tipo get en nuestro controlador de Home y el formulario
Vamos a usar el controlador que ya definimos anteriormente (HomeController); pero vamos a crear una nueva función que vamos a llamar simplemente contact:
public function contact()
{
return view('contact');
}Y la ruta en laravel de tipo GET:
Route::get('/contact', 'HomeController@contact');Ahora la vista que vamos a desarrollar en la función anterior simplemente será una página llamada:
contact.blade.php
Con un formulario o en el cual podemos colocar el nombre, apellido y un mensaje; como puedes ver:
<form action="contact_post" method="POST">
<label>Nombre</label>
<input type="text" name="nombre" id="">
<br>
<label>Apellido</label>
<input type="text" name="apellido" id="">
<br>
<label>Mensaje</label>
<textarea name="mensaje"></textarea>
<br>
<input type="submit" value="Enviar">
</form>
Al menos de momento vamos a enviarlo vía get; pudiéramos enviarlo a la misma función que definimos anteriormente, pero lo mejor que podemos hacer es enviarlo a una nueva función; para eso:
public function contact_post()
{
return view('contact');
}Crear la función y ruta Post para recibir los datos
Ahora, vamos a definir la función que se encarga de recibir los datos (POST); como puedes suponer si has desarrollado en otros frameworks; en estos casos tenemos que trabajar con la petición del usuario, que en inglés se llama request; en Laravel 10 podemos inyectar la misma, es decir, pasarla como parámetro a la función del controlador; por lo tanto, estamos inyectando la petición de nuestro usuario en la función que se encarga de recibir los datos; te dejo la documentación oficial.
Para que veas que mas puedes hacer con el requests , ya que podemos conseguir información o datos interesantes de nuestro usuario, pero lo que nos interesa en esta oportunidad es obtener los datos.
Y ahora, vamos a imprimir los datos que recibimos de nuestro usuario desde la misma función del controlador:
public function contact_post(Request $request)
{
echo "Nombre: ".$request->input('nombre')."<br>";
echo "Apellido: ".$request->apellido."<br>";
echo "Msj: ".request('mensaje')."<br>";
return view('contact');
}Y si definimos una ruta como la siguiente:
Route::post('/contact_post', 'HomeController@contact_post');Y si vamos a nuestro navegador:
Veremos que no funciona y nos devuelve un mensaje de tipo 419:
Protección CSRF en Laravel
Esto se debe a que cuando hacemos una petición de tipo Post, Put Patch o Delete, tenemos que emplear un token para la protección llamado csrt; por lo tanto nuestro formulario queda de la siguiente manera:
<form action="contact_post" method="POST">
@csrf
<label>Nombre</label>
<input type="text" name="nombre" id="">
<br>
<label>Apellido</label>
<input type="text" name="apellido" id="">
<br>
<label>Mensaje</label>
<textarea name="mensaje"></textarea>
<br>
<input type="submit" value="Enviar">
</form>La protección CSRF (Cross-Site Request Forgery) es un mecanismo de seguridad que se utiliza para evitar ataques CSRF. Laravel proporciona protección contra este tipo de ataques generando un token CSRF que es una cadena aleatoria que se genera para cada petición realizada desde un formulario. Este token es luego comprobado iternamente por Laravel para saber que la petición recibida fue generada desde una vista interna de la aplicación en Laravel.
Y si probamos otra vez:
Buala! Allí lo tenemos todo:
Recibir datos vía post desde nuestro formulario
Generalmente, cuando nosotros vamos a enviar datos al servidor se recomienda emplear las peticiones de tipo post, porque los datos van más seguro encapsulado en la petición y no por la URL como es en el caso de los get. Las peticiones de tipo get generalmente se emplean para obtener datos; así que recuerda definir tu formulario con el método post y emplear las rutas correspondientes.
Extra: Variaciones para obtener el request
Tal cual viste anteriormente; existen varias variaciones que podemos usar para obtener el request del usuario; por ejemplo:
$request->input('nombre'); $request->apellido; request('mensaje');Mostrar los datos del formulario en una vista
Ahora, el objetivo de esta entrada era imprimir los datos enviados por nuestro usuario en una página aparte; para eso vamos a crear una página HTML como la siguiente:
<ul>
<li><strong>Nombre: </strong>{{ $nombre }}</li>
<li><strong>Apellido: </strong>{{ $apellido }}</li>
<li><strong>Mensaje: </strong>{{ $mensaje }}</li>
</ul>En la cual como puedes ver, simplemente estamos imprimiendo los datos; y ahora, desde nuestra función, le pasamos los datos a este vista:
public function contact_post(Request $request)
{
return view('contact_info', [
'nombre' => request('nombre'),
'apellido' => request('apellido'),
'mensaje' => request('mensaje'),
]);
}Y con esto, al enviar el formulario este es el resultado:
Notas y consideraciones
- Recuerda que existen múltiples tipos de métodos que podemos emplear con HTTP, Métodos de tipo GET, POST, PUT, DELETE, PATCH y con estos podemos comunicarnos con el servidor, pero solamente podemos emplear peticiones de tipo GET o POST para cuando estamos trabajando con el API de HTML.
- Las rutas de tipo GET las empleamos para consumir recursos desde el navegador, por ejemplo entrar en una página o hacer filtros o búsquedas; ya que son peticiones más inseguras que las del resto de los tipos, por ejemplo las de tipo POST ya que las de tipo GET, los parámetros viajan en la URL del navegador, lo que conlleva a un posible agujero de seguridad si quieres pasar datos sensibles de la app; por lo tanto, para procesar datos mediante formularios generalmente empleamos las peticiones de tipo POST.
- Recuerda emplear la protección CSRF de Laravel para evitar ataques a tu web; esto simplemente es un token que genera Laravel para saber que los datos que está recibiendo son del formulario que forma parte de la aplicación:
{{ csrf_field() }}
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter