jairogarcíarincón

Usuarios en el back-end

11.0K
Usuarios en el back-end
06/09/2023

Contenidos

  1. Objetivos
  2. Instalación
  3. Configuración
  4. Base de datos
  5. Plug-ins
  6. Enrutando la home
  7. Layout y rutas del front-end
  8. Noticias en el front-end
  9. Resto de vistas del front-end
  10. Auth
  11. Layout del back-end
  12. Vistas y acciones de Auth
  13. Usuarios en el back-end
  14. Noticias en el back-end
  15. Helpers
  16. Paginación de noticias
  17. API de noticias
  18. Cambiar contraseña con envío de email
  19. Conclusiones
  20. Práctica: CMS con Laravel

Introducción



En este apartado crearemos todas las opciones relativas a la gestión de usuarios en el panel de administración.

No obstante, antes de empezar, debemos asegurarnos de que el primer usuario que hemos creado mediante registro tenga la opción de usuarios activada, ya que por defecto, para los usuarios que se creen, dicha opción esta desactivada.

Para ello, accede a tu editor gráfico o consola SQL y modifica el valor de usuarios a 1 para el usuario seleccionado. En mi caso el comando sería:

use cms_laravel;
UPDATE usuarios SET usuarios = 1 WHERE name = "Jairo";
view raw laravel-cms-051.sql hosted with ❤ by GitHub


De este modo, nuestro usuario ya tiene acceso a la pestaña de usuarios y a todas las acciones relativas que desarrollaremos a continuación.

Archivo de rutas



Empezaremos por crear es una serie de rutas en nuestro archivo routes/web.php:

<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\AppController;
use App\Http\Controllers\AuthController;
use App\Http\Controllers\AdminController;
use App\Http\Controllers\UsuarioController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
//Front-end
Route::get('/', [AppController::class, 'index'])->name('home');
Route::get('noticias', [AppController::class, 'noticias'])->name('noticias');
Route::get('noticia/{slug}', [AppController::class, 'noticia'])->name('noticia');
Route::get('acerca-de', [AppController::class, 'acercade'])->name('acerca-de');
//Back-end
Route::get('admin', [AdminController::class, 'index'])->name('admin');
Route::get('admin/usuarios', [UsuarioController::class, 'index'])->middleware('role:usuarios');
Route::get('admin/usuarios/crear', [UsuarioController::class, 'crear'])->middleware('role:usuarios');
Route::post('admin/usuarios/guardar', [UsuarioController::class, 'guardar'])->middleware('role:usuarios');
Route::get('admin/usuarios/editar/{id}', [UsuarioController::class, 'editar'])->middleware('role:usuarios');
Route::post('admin/usuarios/actualizar/{id}', [UsuarioController::class, 'actualizar'])->middleware('role:usuarios');
Route::get('admin/usuarios/activar/{id}', [UsuarioController::class, 'activar'])->middleware('role:usuarios');
Route::get('admin/usuarios/borrar/{id}', [UsuarioController::class, 'borrar'])->middleware('role:usuarios');
//Auth
Route::get('acceder', [AuthController::class, 'acceder'])->name('acceder');
Route::post('autenticar', [AuthController::class, 'autenticar'])->name('autenticar');
Route::get('registro', [AuthController::class, 'registro'])->name('registro');
Route::post('registrarse', [AuthController::class, 'registrarse'])->name('registrarse');
Route::post('salir', [AuthController::class, 'salir'])->name('salir');
view raw laravel-cms-052.php hosted with ❤ by GitHub



Middleware



Supongo que te habrá llamado la atención que todas las rutas relativas a usuarios llevan la opción de middleware("role:usuarios").

Un middleware es un mecanismo para filtrar peticiones HTTP a nuestra aplicación, o dicho de otro modo, es una forma de asegurarnos de que ningún usuario no autorizado realiza acciones no permitidas.

Para hacerte una idea de cómo funcionan, puedes echar un vistazo a los diferentes middlewares creados por defecto dentro de la carpeta app/Http/Middleware.

Para nuestra aplicación, vamos a crear un nuevo middleware llamado Roles que se encargará de comprobar si el campo, columna o rol correspondiente (usuarios o noticias) está a 1 antes de realizar la acción y, en caso contrario, redireccionará al inicio del panel de administración con un mensaje de error de permisos.

Para empezar, ejecuta el siguiente comando en la raíz de tu proyecto:

php artisan make:middleware Roles
view raw laravel-cms-053.c hosted with ❤ by GitHub


Esto habrá creado una nueva clase dentro de app/Http/Middleware llamada Roles (tendrás que refrescar o descargar dicho archivo a tu IDE antes de poder abrirlo).

A continuación, abre el archivo anterior y modifícalo para que incluya lo siguiente:

<?php
namespace App\Http\Middleware;
use Closure;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
class Roles
{
/**
* Handle an incoming request.
*
* @param \Illuminate\Http\Request $request
* @param \Closure(\Illuminate\Http\Request): (\Illuminate\Http\Response|\Illuminate\Http\RedirectResponse) $next
* @param $role
* @return \Illuminate\Http\Response|\Illuminate\Http\RedirectResponse
*/
public function handle(Request $request, Closure $next, $role)
{
//Compruebo si el campo correspondiente (usuarios o noticias) es igual a 1
if (Auth::user()->$role != 1) {
return redirect('admin')->with('warning', 'Operación no autorizada');
}
return $next($request);
}
}
view raw laravel-cms-054.php hosted with ❤ by GitHub



Para finalizar, registra el middleware en la aplicación añadiéndolo al array $routeMiddleware del archivo app/Http/Kernel.php:

/* AÑADIR COMO NUEVO ELEMENTO DEL ARRAY $routeMiddleware */
'role' => \App\Http\Middleware\Roles::class,
view raw laravel-cms-056.php hosted with ❤ by GitHub



UsuarioController



Una vez ajustados los permisos de la sección de usuarios, es el momento de crear el controlador de usuarios en el que desarrollar las acciones correspondientes.

Crea una nueva clase app/Http/Controllers/UsuarioController con el siguiente código:

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Hash;
use App\Models\Usuario;
use App\Http\Requests\UsuarioRequest;
class UsuarioController extends Controller
{
public function __construct()
{
/**
* Asigno el middleware auth al controlador,
* de modo que sea necesario estar al menos autenticado
*/
$this->middleware('auth');
}
/**
* Mostrar un listado de elementos
*
* @return \Illuminate\Http\Response
*/
public function index()
{
//Obtengo todos los usuarios ordenados por nombre
$rowset = Usuario::orderBy("nombre","ASC")->get();
return view('admin.usuarios.index',[
'rowset' => $rowset,
]);
}
/**
* Mostrar el formulario para crear un nuevo elemento
*
* @return \Illuminate\Http\Response
*/
public function crear()
{
//Creo un nuevo usuario vacío
$row = new Usuario();
return view('admin.usuarios.editar',[
'row' => $row,
]);
}
/**
* Guardar un nuevo elemento en la bbdd
*
* @param \App\Http\Requests\UsuarioRequest $request
* @return \Illuminate\Http\Response
*/
public function guardar(UsuarioRequest $request)
{
Usuario::create([
'nombre' => $request->nombre,
'email' => $request->email,
'password' => Hash::make($request->password),
'usuarios' => ($request->usuarios) ? 1 : 0,
'noticias' => ($request->noticias) ? 1 : 0,
]);
return redirect('admin/usuarios')->with('success', 'Usuario <strong>'.$request->nombre.'</strong> creado');
}
/**
* Mostrar el formulario para editar un elemento
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function editar($id)
{
//Obtengo el usuario o muestro error
$row = Usuario::where('id', $id)->firstOrFail();
return view('admin.usuarios.editar',[
'row' => $row,
]);
}
/**
* Actualizar un elemento en la bbdd
*
* @param \App\Http\Requests\UsuarioRequest $request
* @param int $id
* @return \Illuminate\Http\Response
*/
public function actualizar(UsuarioRequest $request, $id)
{
$row = Usuario::findOrFail($id);
Usuario::where('id', $row->id)->update([
'nombre' => $request->nombre,
'email' => $request->email,
'password' => ($request->cambiar_clave) ? Hash::make($request->password) : $row->password,
'usuarios' => ($request->usuarios) ? 1 : 0,
'noticias' => ($request->noticias) ? 1 : 0,
]);
return redirect('admin/usuarios')->with('success', 'Usuario <strong>'.$request->nombre.'</strong> guardado');
}
/**
* Activar o desactivar elemento.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function activar($id)
{
$row = Usuario::findOrFail($id);
$valor = ($row->activo) ? 0 : 1;
$texto = ($row->activo) ? "desactivado" : "activado";
Usuario::where('id', $row->id)->update(['activo' => $valor]);
return redirect('admin/usuarios')->with('success', 'Usuario <strong>'.$row->name.'</strong> '.$texto.'.');
}
/**
* Borrar elemento.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function borrar($id)
{
$row = Usuario::findOrFail($id);
Usuario::destroy($row->id);
return redirect('admin/usuarios')->with('success', 'Usuario <strong>'.$row->nombre.'</strong> borrado');
}
}
view raw laravel-cms-060.php hosted with ❤ by GitHub



UsuarioRequest



Como puedes observar en las acciones guardar() y activar() se hace referencia a la clase UsuarioRequest.

Estas clases de tipo FormRequest sirven para establecer ciertas reglas a los campos de nuestro formulario (filtros, validaciones, etc.). Toda la información referente a los mismos se encuentra en https://laravel.com/docs/8.x/validation#form-request-validation.

En nuestro caso, hemos ejecutado en la raíz de nuestro proyecto el comando:

php artisan make:request UsuarioRequest
view raw laravel-cms-058.c hosted with ❤ by GitHub


Que ha creado el archivo app/Http/Requests/UsuarioRequest, el cual debes descargar a tu IDE y modificar con el siguiente contenido:

<?php
namespace App\Http\Requests;
use Illuminate\Http\Request;
use Illuminate\Foundation\Http\FormRequest;
use Illuminate\Support\Facades\Auth;
class UsuarioRequest extends FormRequest
{
/**
* Determina si el usuario está autorizado a hacer este request
*
* @return bool
*/
public function authorize()
{
return Auth::check();
}
/**
* Obtiene las reglas de validación para este request.
*
* @return array
*/
public function rules(Request $request)
{
//Nombre requerido y máximo 255 caracteres
//Email requerido, válido, único en la tabla usuarios y máximo 255 caracteres
$rules = [
'nombre' => 'required|max:255',
'email' => 'required|regex:/^.+@.+$/i|unique:usuarios,email,'.$request->id.'|max:255',
];
//Si estoy cambiando la clave (o es nuevo), password requerido y entre 8 y 16 caracteres
if ($request->cambiar_clave) {
$rules['password'] = 'required|min:8|max:16';
}
return $rules;
}
}
view raw laravel-cms-059.php hosted with ❤ by GitHub



Vista de listado de usuarios (archivo resources/views/admin/usuarios/index.blade.php)



@extends('layouts.admin')
@section('content')
<h3>
<a href="{{ route("admin") }}" title="Inicio">Inicio</a> <span>| Usuarios</span>
</h3>
<div class="row">
<!--Nuevo-->
<article class="col s12 l6">
<div class="card horizontal admin">
<div class="card-stacked">
<div class="card-content">
<i class="grey-text material-icons medium">person</i>
<h4 class="grey-text">
nuevo usuario
</h4><br><br>
</div>
<div class="card-action">
<a href="{{ url("admin/usuarios/crear") }}" title="Añadir nuevo usuario">
<i class="material-icons">add_circle</i>
</a>
</div>
</div>
</div>
</article>
@foreach ($rowset as $row)
<article class="col s12 l6">
<div class="card horizontal sticky-action admin">
<div class="card-stacked">
<div class="card-content">
<i class="material-icons medium">person</i>
<h4>
{{ $row->nombre }}
</h4>
<strong>Usuarios: </strong>{{ ($row->usuarios) ? "Sí" : "No" }}<br>
<strong>Noticias: </strong>{{ ($row->noticias) ? "Sí" : "No" }}
</div>
<div class="card-action">
<a href="{{ url("admin/usuarios/editar/".$row->id) }}" title="Editar">
<i class="material-icons">edit</i>
</a>
@php
$title = ($row->activo == 1) ? "Desactivar" : "Activar";
$color = ($row->activo == 1) ? "green-text" : "red-text";
$icono = ($row->activo == 1) ? "mood" : "mood_bad";
@endphp
<a href="{{ url("admin/usuarios/activar/".$row->id) }}" title="{{ $title }}">
<i class="{{ $color }} material-icons">{{ $icono }}</i>
</a>
<a href="#" class="activator" title="Borrar">
<i class="material-icons">delete</i>
</a>
</div>
</div>
<!--Confirmación de borrar-->
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">Borrar usuario<i class="material-icons right">close</i></span>
<p>
¿Está seguro de que quiere borrar al usuario<strong>{{ $row->nombre }}</strong>?<br>
Esta acción no se puede deshacer.
</p>
<a href="{{ url("admin/usuarios/borrar/".$row->id) }}" title="Borrar">
<button class="btn waves-effect waves-light" type="button">Borrar
<i class="material-icons right">delete</i>
</button>
</a>
</div>
</div>
</article>
@endforeach
</div>
@endsection
view raw laravel-cms-061.php hosted with ❤ by GitHub


listado usuarios



Vista de creación/edición de usuario (archivo resources/views/admin/usuarios/editar.blade.php)



@extends('layouts.admin')
@section('content')
<h3>
<a href="{{ route("admin") }}" title="Inicio">Inicio</a> <span>| </span>
<a href="{{ url("admin/usuarios") }}" title="Usuarios">Usuarios</a> <span>| </span>
@if ($row->id)
<span>Editar {{ $row->nombre }}</span>
@else
<span>Nuevo usuario</span>
@endif
</h3>
<div class="row">
@php $accion = ($row->id) ? "actualizar/".$row->id : "guardar" @endphp
<form class="col m12 l6" method="POST" action="{{ url("admin/usuarios/".$accion) }}">
@csrf
<div class="row">
<div class="input-field col s12">
<input id="nombre" type="text" name="nombre" value="{{ $row->nombre }}">
<label for="nombre">Nombre</label>
</div>
<div class="input-field col s12">
<input id="email" type="text" name="email" value="{{ $row->email }}">
<label for="email">E-mail</label>
</div>
@php $clase = ($row->id) ? "hide" : "" @endphp
<div class="input-field col s12 {{ $clase }}" id="password">
<input id="password" type="password" name="password" value="">
<label for="password">Contraseña</label>
</div>
@if ($row->id)
<p>
<label for="cambiar_clave">
<input id="cambiar_clave" name="cambiar_clave" type="checkbox">
<span>Pulsa para cambiar la clave</span>
</label>
</p>
@else
<input type="hidden" name="cambiar_clave" value="1">
@endif
</div>
<div class="row">
<p>Permisos</p>
<p>
<label for="noticias">
<input id="noticias" name="noticias" type="checkbox" {{ ($row->noticias == 1) ? "checked" : "" }}>
<span>Noticias</span>
</label>
</p>
<p>
<label for="usuarios">
<input id="usuarios" name="usuarios" type="checkbox" {{ ($row->usuarios == 1) ? "checked" : "" }}>
<span>Usuarios</span>
</label>
</p>
<div class="input-field col s12">
<a href="{{ url("admin/usuarios") }}" title="Volver">
<button class="btn waves-effect waves-light" type="button">Volver
<i class="material-icons right">replay</i>
</button>
</a>
<button class="btn waves-effect waves-light" type="submit" name="guardar">Guardar
<i class="material-icons right">save</i>
</button>
</div>
</div>
</form>
</div>
@endsection
view raw laravel-cms-062.php hosted with ❤ by GitHub


editar usuario



Una vez hecho todo esto, ya podrías crear, editar, activar/desactivar y borrar usuarios, siempre que tengas permisos, claro.

En el próximo apartado desarrollaremos las acciones relativas a la gestión de noticias desde el panel de administración y crearemos todas las vistas.


Ejercicios propuestos


  1. Modifica el proyecto para que, mediante un nuevo middleware, un usuario solo pueda crear a otro usuario si tiene el campo crear de la tabla usuarios a 1 (incluyendo sus vistas asociadas)

  2. Modifica el proyecto para que, mediante un nuevo middleware, un usuario no se pueda borrar a sí mismo (incluyendo sus vistas asociadas)

  3. Modifica el punto anterior para que, el método borrar se gestione mediante un nuevo BorrarRequest que impida que un usuario se pueda borrar a sí mismo (incluyendo sus vistas asociadas)


Publicado el 23 de Junio de 2025

bloggestor de contenidoslaravelphpcssjquery