PHP e Cookie: salvare il formato della visualizzazione dell’interfaccia

Introduzione

I cookie sono uno strumento semplice ma molto utile per mantenere una piccola informazione lato browser tra una visita e l’altra. In questo tutorial vediamo un caso pratico e spesso sottovalutato: salvare il formato di visualizzazione dell’interfaccia, ad esempio la preferenza tra vista lista e vista griglia in un catalogo prodotti, in una dashboard o in un archivio articoli.

Questo approccio è ideale quando vuoi rendere l’esperienza dell’utente più comoda senza obbligarlo a riconfigurare ogni volta la pagina. La preferenza viene memorizzata in un cookie con scadenza, così il browser la ricorda anche dopo la chiusura della scheda o del sito.

Il vantaggio è pratico: non stai salvando dati sensibili, ma solo una preferenza di interfaccia. Questo rende il cookie un’ottima soluzione, più leggera rispetto a un salvataggio nel database e più persistente rispetto a una semplice variabile di sessione.

Codice completo

Nel seguente esempio realizziamo una pagina PHP che permette di scegliere tra due modalità di visualizzazione: lista e griglia. La scelta viene salvata in un cookie valido per 30 giorni.

<?php
// Avvio della sessione non è obbligatorio per i cookie,
// ma può essere utile se in futuro vuoi integrare altre preferenze utente.
session_start();

// Nome del cookie e valori ammessi
$cookieName = ´view_mode´;
$allowedModes = [´list´, ´grid´];

// Valore di default
$viewMode = ´list´;

// Se l´utente ha appena scelto una modalità tramite GET, aggiorniamo il cookie
if (isset($_GET[´mode´]) && in_array($_GET[´mode´], $allowedModes, true)) {
    $viewMode = $_GET[´mode´];

    // Cookie valido per 30 giorni
    setcookie(
        $cookieName,
        $viewMode,
        [
            ´expires´ => time() + (60 * 60 * 24 * 30),
            ´path´ => ´/´,
            ´secure´ => isset($_SERVER[´HTTPS´]),
            ´httponly´ => false,
            ´samesite´ => ´Lax´
        ]
    );

    // Aggiorniamo anche la variabile locale per l´uso immediato nella stessa richiesta
    $_COOKIE[$cookieName] = $viewMode;
}

// Se il cookie esiste ed è valido, lo usiamo
if (isset($_COOKIE[$cookieName]) && in_array($_COOKIE[$cookieName], $allowedModes, true)) {
    $viewMode = $_COOKIE[$cookieName];
}

// Dati di esempio: un piccolo catalogo
$products = [
    [´name´ => ´Notebook PHP´, ´price´ => ´29,90 €´],
    [´name´ => ´Guida MySQL´, ´price´ => ´24,50 €´],
    [´name´ => ´Manuale JavaScript´, ´price´ => ´31,00 €´],
    [´name´ => ´Libro UX Design´, ´price´ => ´27,80 €´],
];
?>

<!DOCTYPE html>
<html lang="it">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Preferenza visualizzazione</title>
</head>
<body>
    <h1>Catalogo prodotti</h1>

    <p>
        Vista attuale:
        <strong><?php echo htmlspecialchars($viewMode); ?></strong>
    </p>

    <p>
        <a href="?mode=list">Vista lista</a> |
        <a href="?mode=grid">Vista griglia</a>
    </p>

    <hr>

    <?php if ($viewMode === ´list´): ?>
        <ul>
            <?php foreach ($products as $product): ?>
                <li>
                    <strong><?php echo htmlspecialchars($product[´name´]); ?></strong>
                    - <?php echo htmlspecialchars($product[´price´]); ?>
                </li>
            <?php endforeach; ?>
        </ul>
    <?php else: ?>
        <div style="display: flex; gap: 16px; flex-wrap: wrap;">
            <?php foreach ($products as $product): ?>
                <div style="border: 1px solid #ccc; padding: 12px; width: 180px;">
                    <strong><?php echo htmlspecialchars($product[´name´]); ?></strong>
                    <p><?php echo htmlspecialchars($product[´price´]); ?></p>
                </div>
            <?php endforeach; ?>
        </div>
    <?php endif; ?>
</body>
</html>

Spiegazione

Il codice è costruito per essere semplice ma realistico. Vediamo i punti chiave.

1. Lettura della preferenza dal cookie

All’inizio definiamo il nome del cookie, i valori consentiti e una modalità predefinita:

view_mode è il nome del cookie
list e grid sono i soli valori validi
list è il fallback se il cookie non esiste

Questo controllo è importante perché non bisogna mai fidarsi ciecamente dei dati letti dal browser. Un cookie può essere modificato manualmente dall’utente.

2. Impostazione del cookie

Quando l’utente clicca su un link come ?mode=grid, il codice verifica che il parametro sia tra quelli ammessi. Se lo è, salva il valore nel cookie con setcookie().

La durata scelta è di 30 giorni, ottenuta con:

time() + (60 * 60 * 24 * 30)

Questa formula calcola il timestamp di scadenza aggiungendo 30 giorni all’ora corrente.

3. Uso di opzioni moderne in setcookie()

Nel codice usiamo la forma consigliata di setcookie() con array di opzioni. È più chiara e permette di definire:

expires: data di scadenza
path: ambito del cookie, qui impostato su / per renderlo disponibile in tutto il sito
secure: invia il cookie solo su HTTPS, se disponibile
httponly: qui è false perché il cookie non è sensibile e non serve leggerlo via JavaScript
samesite: aiuta a ridurre alcuni rischi legati a richieste cross-site

4. Visualizzazione condizionata

In base al valore di $viewMode, la pagina mostra il contenuto in due modi diversi:

lista: una semplice lista HTML con <ul>
griglia: una disposizione a blocchi, utile per cataloghi e schede prodotto

In un progetto reale, la parte grafica sarebbe gestita con CSS, ma qui l’obiettivo è concentrarsi sulla logica PHP del cookie.

Best practice

Quando usi i cookie per salvare preferenze non sensibili, è bene seguire alcune regole fondamentali.

Valida sempre i dati letti dal cookie: non usare mai il valore senza controllarlo.
Usa valori semplici: meglio salvare stringhe brevi come list o grid, non strutture complesse.
Imposta una scadenza ragionevole: per una preferenza di interfaccia 15, 30 o 90 giorni sono spesso sufficienti.
Preferisci HTTPS: il flag secure dovrebbe essere attivo in produzione.
Non usare il cookie per dati sensibili: una preferenza di layout va bene, una password assolutamente no.
Prevedi un valore di default: se il cookie manca o è corrotto, la pagina deve funzionare comunque.
Separare logica e presentazione: il cookie decide la modalità, ma la grafica dovrebbe essere gestita dal CSS e non da HTML inline in un progetto serio.

Un’altra buona pratica è offrire all’utente un modo per resettare la preferenza. Ad esempio, potresti creare un link “Ripristina vista predefinita” che imposta il cookie a scadenza breve oppure lo elimina.

Riepilogo

Salvare il formato di visualizzazione dell’interfaccia con i cookie è un esempio concreto di persistenza leggera e utile. Con poche righe di PHP puoi ricordare la preferenza dell’utente tra una visita e l’altra, migliorando la UX senza introdurre complessità inutili.

Il flusso essenziale è questo:

l’utente sceglie una modalità di visualizzazione
PHP valida il valore
il valore viene salvato in un cookie con scadenza
alle visite successive il cookie viene letto e applicato

Questo pattern è perfetto per preferenze non critiche, come layout, densità dei contenuti, dimensione delle schede o impostazioni di visualizzazione di una dashboard.

Approfondisci con risorse ufficiali

PHP manual - setcookie(): documentazione ufficiale sulla creazione e gestione dei cookie
PHP manual - $_COOKIE: superglobale per leggere i cookie inviati dal browser
PHP manual - htmlspecialchars(): utile per stampare valori in modo sicuro nell’HTML
MDN Web Docs - HTTP Cookies: panoramica completa sul comportamento dei cookie nel browser
MDN Web Docs - SameSite cookies: approfondimento sulla protezione contro alcuni attacchi cross-site

Se vuoi, nel prossimo passo posso anche mostrarti una versione più professionale di questo esempio, con CSS separato, pulsante di reset della preferenza e gestione tramite POST invece che tramite link GET.

Add as preferred source on Google