Desenvolupament web dinàmic backend amb PHP
Conceptes¶

Sessió 7: Sessions / Intranet¶

Objectiu Sessió 7

L’objectiu d’aquesta sessió serà la de treballar les variables de sessió per que puguin ser usades durant el concepte de sessió de navegació web. Implementarem el concepte de intranet en base a les variables de sessió. Aquest concepte afecta a la UX de l'usuari en l'aplicació i sobretot a l'arquitectura de desenvolupament frontend / backend

Sessions en backend¶

Enllaç a W3Schools Sessions i PHP.net

Què és una sessió?

Una sessió web és un mecanisme que permet mantenir la continuïtat entre diferents peticions HTTP fetes pel mateix usuari. Com que el protocol HTTP és sense estat (stateless), cada petició és independent de l’anterior. Això vol dir que, si no fem res, el servidor oblida l’usuari a cada nova pàgina que visita.

Per evitar això, utilitzem el concepte de sessió, que permet al servidor recordar informació entre peticions.

Exemples d’ús habitual de sessions:

Escenari	Per què cal sessió?
Usuari fa login	El servidor ha de recordar qui és l’usuari
Cistella de la compra	S'ha de recordar què ha afegit l'usuari
Configuració d’usuari	Idioma, preferències, rols...
Formularis multi-pàgina	Guardar dades temporals entre passos

Com funciona tècnicament?

Quan l’usuari accedeix al servidor, aquest crea un ID de sessió únic (una cadena aleatòria).
Aquest ID s’envia al navegador com una cookie de sessió (ex: PHPSESSID en PHP).
En les següents peticions, el navegador envia automàticament aquest ID.
El servidor utilitza aquest ID per accedir a les dades emmagatzemades per aquest usuari.

Sense sessió:

En el cas de no usar el concepte de sessió al backend, no podriem identificar de cap maenra quina és la petició HTTP GET que està navegant, per tant, cada cop que l’usuari visita una pàgina nova, hauria de tornar a identificar-se, configurar preferències, etc.

La UX seria molt deficient.

Arrays i variables de sessió¶

Les variables de sessió són dades associades a la sessió d’un usuari que es guarden al servidor.

Són molt útils per:

Mantenir l’usuari autenticat.
Emmagatzemar preferències temporals.
Guardar informació sensible (que no volem enviar al navegador).

Bàsicament estan basades en l'array associatiu $_SESSION, on cada valor associatiu que definim és la variable de sessió.

Tindrem tot un conjunt de funcions de sessió per a treballar la seva funcionaliat.

Com utilitzar variables de sessió en PHP

Iniciar la sessió

Abans de poder treballar amb variables de sessió, cal cridar session_start(); a l'inici del fitxer PHP (abans de qualsevol echo o sortida HTML).

<?php
session_start();
?>

Important

Si no ho fas, les variables de sessió no existiran i no podràs llegir ni escriure dades.

Guardar informació a la sessió

Pots desar qualsevol tipus de dada a la variable global $_SESSION, que funciona com un array associatiu.

<?php
session_start();
$_SESSION['usuari'] = 'joan';
$_SESSION['rol'] = 'administrador';
?>

Recuperar informació de la sessió

Per obtenir les dades desades:

<?php
session_start();
echo $_SESSION['usuari']; // Mostra: joan
echo $_SESSION['rol'];    // Mostra: administrador
?>

Eliminar dades de sessió

Eliminar una variable concreta

<?php
unset($_SESSION['usuari']);
?>

Destruir tota la sessió

Per exemple, en fer logout:

<?php
session_start();
session_destroy();
?>

Important

Després de session_destroy(), les dades de $_SESSION no es poden accedir.

Conceptes claus a recordar

$_SESSION només existeix després de session_start();.
Les variables de sessió només viuen durant la sessió activa de l’usuari.
Són segures perquè es guarden al servidor, no al navegador.

Exemple pràctic¶

Exemple d'ús bàsic de sessions

Visualització LOGINVisualització IniciCodi PHP login.phpCodi PHP inici.phpExplicació

    <?php
    session_start();
    echo "Login";
    $_SESSION['usuari'] = 'joan';
    //header('Location: http://localhost/Exemples/PHP/docs/php/exemples/S7/p3-s7-ex1-inici.php');
    exit;
    ?>

    <?php
    session_start();
    echo "Hola, " . $_SESSION['usuari'];
    ?>

Al primer fitxer de login.php

- Iniciem la sessió, que significa treballar amb id de sessió.
- Desem el nom de l'usuari a una variable de sessió
- Anem a inici.php

Al segon fitxer de inici.php

- Cal iniciar sessió, per recuperar el id de sessió
- i podem accedir directament a la variable de sessió per recuperar el nom d'usuari generat a la pàgina anterior de login.php

Notem que si accedim directament a la 2a pàgina, depenent de si anteriorment ha generat la variable de sessió tindrà o no valor.

Concepte Intranet¶

Una intranet és una aplicació web privada, on només poden accedir-hi usuaris autenticats.
Normalment, requereix un sistema de login i una gestió de sessió per controlar qui té accés.

Parts d’una intranet bàsica¶

Login públic:
Formulari per demanar usuari i contrasenya.
Àrea privada protegida:
Pàgines que només es poden veure si l’usuari està autenticat.
Control d'accés:
Cada pàgina protegida ha de comprovar si hi ha una sessió activa.
Logout:
Permet tancar la sessió i eliminar les dades de l'usuari.

Controlar l’accés amb variables de sessió¶

Cada pàgina privada ha de verificar que l’usuari està loguejat.
Això es fa comprovant si existeix una variable de sessió.

Exemple de control d'accés:¶

    <?php
         session_start();
        if (!isset($_SESSION['usuari'])) {
            header('Location: login.php');
            exit;
        }
    ?>
    <!-- Contingut visible només si està autenticat -->
    <h1>Benvingut a la intranet!</h1>

No autenticat

Si l’usuari no està autenticat, és redirigit automàticament cap a login.php.

Flux de navegació d'una intranet¶

[Usuari entra a login.php] → Envia formulari → [Servidor valida i desa a sessió]

[Usuari va a inici.php]
    - Si té sessió → pot veure inici.php
    - Si NO té sessió → redirigeix a login.php

Exemples pràctics de pàgines¶

Fitxer	Descripció
`login.php`	Formulari d’entrada d’usuari i contrasenya
`inici.php`	Àrea privada (protecció amb sessió)
`perfil.php`	Informació personal de l’usuari (protecció amb sessió)
`logout.php`	Fitxer que tanca la sessió i torna al login

Què passa si no gestionem bé la sessió?

Qualsevol usuari podria accedir a pàgines privades.
Problemes de seguretat: accés a dades sensibles.
Experiència d’usuari inconsistent (errors estranys de pàgina).

Framworks i WS

Més endavant aprendreu com es gestiona tot el tema de seguretat d'usuari, d'accés i d'intranet amb el tema de tokens i sessions en l'entorns de Framworks i Web Services.

Com afecta a la UX¶

La manera com gestionem la sessió té un impacte directe en la experiència d'usuari.
Un bon sistema de sessió millora la confiança, la fluïdesa i la satisfacció.

Beneficis d'una bona gestió de sessió

Aspecte	Millora de la UX
Autenticació persistent	L'usuari no ha de loguejar-se constantment
Personalització	Mostrar continguts adaptats segons l'usuari
Fluïdesa	Navegació sense interrupcions ni errors d'accés
Seguretat	L'usuari se sent protegit en un entorn privat
Coherència	El sistema sap qui és l'usuari a cada pàgina

Exemples pràctics

Benvinguda personalitzada:
Mostrar "Hola, Joan!" després de fer login.
Accés automàtic a seccions personals:
L'usuari pot accedir directament al seu perfil sense tornar a introduir dades.
Tancament segur:
Quan fa logout, l'usuari sap que ningú més pot accedir amb la seva sessió.
Redireccions clares:
Si la sessió caduca, es redirigeix automàticament al login amb un missatge amigable.

Què passa si la gestió de sessió és dolenta?

L'usuari podria perdre informació o ser expulsat sobtadament.
Potser hauria de reintroduir dades contínuament.
Inseguretat: podria pensar que les seves dades no estan protegides.
Sensació de sistema inestable o no fiable.

Bones pràctiques per millorar la UX amb sessions

Mostrar missatges clars si la sessió caduca ("La teva sessió ha expirat, torna a iniciar sessió").
Recordar dades importants (nom, preferències, rols).
Permetre tancar sessió fàcilment i amb confirmació.
Evitar "errors 403" o pàgines en blanc si la sessió no existeix: sempre redirigir amb explicacions.

Arquitectura Frontend / Backend¶

Quan comencem a treballar amb sessions i control d'accés, canvia l'estructura del nostre projecte:

Frontend i backend han de col·laborar per gestionar correctament la informació de l'usuari i garantir la seguretat i la fluïdesa de l'aplicació.

Què fa el Backend?

- Crea i gestiona la sessió (servidor).
- Controla l'accés a les pàgines protegides.
- Emmagatzema la informació de l'usuari (per exemple, ID, nom, rol).
- Respon a les peticions del frontend basant-se en si hi ha una sessió vàlida.

Exemples de tasques al backend:

Crear $_SESSION['usuari'] = 'joan';
Validar contrasenya i crear sessió
Destruir la sessió en fer logout
Bloquejar l'accés si no hi ha sessió activa

Què fa el Frontend?

- Mostra continguts personalitzats (per exemple, el nom de l'usuari).
- Gestiona l'estat visual (mostrar o ocultar opcions segons si l'usuari està autenticat).
- Envia peticions al backend (formularis de login, logout, etc.).
- Redirigeix si la sessió caduca o és incorrecta (mitjançant el backend o codi client).

Exemples de tasques al frontend:

Mostrar "Benvingut, Joan!"
Mostrar / amagar menú d'usuari
Redirigir a login.php si la resposta del servidor indica "sessió caducada"
Mostrar missatge "Sessió finalitzada correctament" després de logout

Resum¶

Resum

🔹 Què és una sessió?

Espai temporal al servidor per guardar informació de l'usuari.
Es crea amb session_start().
Acaba amb session_destroy().

🔹 Variables de sessió ($_SESSION)

Desa informació com usuari, rol, preferències...
Permet personalització i persistència d'estat entre pàgines.
És segura, ja que s’emmagatzema al servidor.

🔹 Intranet i control d'accés

Zona privada de l'aplicació web (només per a usuaris autenticats).
Protecció de pàgines mitjançant comprovació de la sessió.
Components típics:
- login.php
- inici.php
- perfil.php
- logout.php

🔹 Impacte en la UX (User Experience)

Millora la fluïdesa i la confiança de l'usuari.
Mostra continguts personalitzats (ex: "Hola, Joan!").
Redirigeix amb missatges clars quan la sessió expira.
Evita errors i frustracions.

🔹 Arquitectura Frontend / Backend

Backend:
- Valida les credencials de l'usuari.
- Crea i gestiona la sessió.
- Comprova si la sessió existeix abans de mostrar contingut.
Frontend:
- Mostra informació personalitzada segons la sessió.
- Envia dades de login/logout al servidor.
- Redirigeix l'usuari segons l'estat de la sessió.

Recorda: Una bona gestió de sessions millora la seguretat, l'experiència d'usuari i l'organització de l'aplicació.

🎯 Sessió = clau per a apps segures, personalitzades i professionals

Desenvolupament web dinàmic backend amb PHP Conceptes¶