Saltar a contenido

Autentificación de usuarios

Una sesión establece una relación anónima con un usuario en particular, permitiéndonos reconocer si es el mismo usuario en distintas peticiones. Al implementar un sistema de autenticación, podemos identificar qué usuario está utilizando nuestra aplicación.

Para ello, preparemos un sencillo sistema de autenticación:

  • Mostrar el formulario de login y contraseña.
  • Validar los datos enviados por el usuario.
  • Añadir el nombre de usuario a la sesión si los datos son correctos.
  • Usar la sesión para comprobar si el usuario está autenticado y permitirle realizar tareas específicas.
  • Eliminar la información de autenticación de la sesión cuando el usuario cierre la sesión.
flowchart TD
    A[Formulario de login<br>*index.php*] --> B[Validación de credenciales<br>*login.php*]
    B -->|Credenciales válidas| C[Guardar usuario en sesión<br>*login.php*]
    C --> D[Verificación de credenciales<br>*main.php*]
    D --> E[Eliminar información de la sesión<br>*logout.php*]
    E --> A

    B -->|Credenciales inválidas| A

Archivo index.php: formulario de login

El archivo index.php contiene el formulario que solicita el nombre de usuario y la contraseña. Al enviarlo, el formulario redirige a login.php para procesar la autenticación:

index.php
<form action='login.php' method='post'>
  <fieldset>
    <legend>Login</legend>
    <div><span class='error'><?php echo $error; ?></span></div>
    <div class='fila'>
        <label for='usuario'>Usuario:</label><br />
        <input type='text' name='inputUsuario' id='usuario' maxlength="50" /><br />
    </div>
    <div class='fila'>
        <label for='password'>Contraseña:</label><br />
        <input type='password' name='inputPassword' id='password' maxlength="50" /><br />
    </div>
    <div class='fila'>
        <input type='submit' name='enviar' value='Enviar' />
    </div>
  </fieldset>
</form>

Archivo login.php: validación de credenciales

El archivo login.php actúa como controlador de la autenticación, verificando si se han enviado datos y si son correctos. Si el nombre de usuario y la contraseña coinciden con unas credenciales concretas (en nuestro caso admin/admin), el usuario se guarda en la sesión:

login.php
<?php
// Verificamos si el formulario ha sido enviado
if (isset($_POST['enviar'])){
    $usuario = $_POST['inputUsuario'];
    $password = $_POST['inputPassword'];

    // Validamos que ambos campos estén completos
    if (empty($usuario) || empty($password)) {
        $error = "Debes introducir un usuario y contraseña";
        include "index.php";
    } else {
        // Validación de credenciales
        if ($usuario == "admin" && $password == "admin") {
            // Guardamos el usuario en la sesión
            session_start();
            $_SESSION['usuario'] = $usuario;
            // Cargamos la página principal
            include "main.php";
        } else {
            // Mensaje de error si las credenciales son incorrectas
            $error = "Usuario o contraseña no válidos!";
            include "index.php";
        }
    }
}

Archivo main.php: página principal

En main.php, comprobamos que el usuario esté autenticado al verificar si la sesión contiene el nombre de usuario. Si no es así, se redirige al formulario de inicio de sesión:

main.php
<?php
// Iniciamos la sesión si no ha sido iniciada previamente
if(!isset($_SESSION)) {
    session_start();
}

// Verificamos si el usuario está autenticado
if (!isset($_SESSION['usuario'])) {
    $_SESSION['error'] = "Debes iniciar sesión para acceder a esta página.";
    header("Location: index.php");
    exit(); // Siempre después de un header
}
?>
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Listado de productos</title>
</head>
<body>
    <h1>Bienvenido <?= $_SESSION['usuario'] ?></h1>
    <p>Pulse <a href="logout.php">aquí</a> para salir</p>
    <p>Volver al <a href="main.php">inicio</a></p>
    <h2>Listado de productos</h2>
    <ul>
        <li>Producto 1</li>
        <li>Producto 2</li>
        <li>Producto 3</li>
    </ul>
</body>
</html>

Archivo logout.php: cerrar Sesión

Para cerrar la sesión, usamos session_destroy() en logout.php, lo que elimina toda la información de la sesión y redirige al formulario de login:

logout.php
<?php
// Iniciamos la sesión y la destruimos
session_start();
session_destroy();
header("Location: index.php");

Autenticación en producción

En entornos de producción, la autenticación se maneja generalmente mediante un framework que abstrae y facilita el proceso. En la última unidad veremos cómo implementarlo con Laravel.

Actividades

  • 📝 AC 414. (RA4 RA5 / CE4c CE4d CE4e CE5a CE5b CE5d / IC1 / 3p) - Genera un formulario de inicio de sesión. Luego, programa el controlador, por lo que debes comprobar los datos recibidos (solo permite la entrada de usuario/usuario) y si todo es correcto, mostrar una página con el mensaje "Has accedido". No contiene código HTML.

  • ⚓ AR 415. (RA4 RA5 / CE4c CE4d CE4e CE5a CE5b CE5d / IC1 / 3p) - Desde secretaría necesitan un formulario de acceso. Sólo debe dejar pasar con las credenciales secretaria/1234. Si todo es correcto has de generar un documento HTML con un listado de los módulos de DAW del presente curso, si no es satisfactorio, mostrar el horario de secretaría dependiendo de la hora.

  • 🔬 AP 416. (RA4 RA5 / CE4c CE4d CE4e CE5a CE5b CE5d / IC1 / 3p) - Modifica la actividad AC 414 para que, si no has iniciado sesión, te mande a la página para introducir las credenciales.

    A tener en cuenta

    La redirección ha de ser automática, el usuario no ha de hacer click en nada.