La gestión de tokens de autenticación en Next.js puede fallar si los almacenas de forma insegura.

El truco

// ANTES (mal):
// Almacenando tokens en localStorage
localStorage.setItem('authToken', token);

// DESPUÉS (bien):
// Usando HttpOnly Cookies
import { setCookie } from 'nookies';

// Al establecer el token en el servidor
setCookie({ res }, 'authToken', token, {
  httpOnly: true,
  secure: process.env.NODE_ENV === 'production',
  maxAge: 30 * 24 * 60 * 60,
  path: '/',
});

Los tokens en localStorage son vulnerables a XSS (Cross-Site Scripting). En lugar de eso, utiliza cookies con la opción HttpOnly. Esto asegura que el token no sea accesible desde JavaScript, protegiendo contra ataques XSS. Además, usando secure en producción, te aseguras de que las cookies solo se envíen a través de conexiones HTTPS.

Opta siempre por cookies seguras y HttpOnly para mantener tus tokens a salvo de miradas indiscretas.