Autorización y autenticación en TypeScript: guía completa

Entrenador de Python en Línea para Principiantes

Aprende Python fácilmente sin sobrecargarte de teoría. Resuelve tareas prácticas con verificación automática, recibe pistas y escribe código directamente en el navegador, sin instalar nada.

Start Course

Autorización y autenticación en TypeScript: de la teoría a la práctica



En el desarrollo web moderno, la seguridad de las aplicaciones es una piedra angular. TypeScript, como superconjunto estrictamente tipado de JavaScript, proporciona herramientas potentes para construir sistemas robustos de autenticación (verificación de la identidad del usuario) y autorización (verificación de los permisos de acceso). En este artículo, analizaremos los conceptos clave, las bibliotecas populares y escribiremos un ejemplo funcional en TypeScript.



Conceptos básicos: autenticación vs autorización



A menudo estos términos se confunden. Vamos a diferenciarlos claramente:

  • Autenticación (Authentication) — el proceso de verificar quién eres. Por ejemplo, iniciar sesión con usuario y contraseña o a través de un servicio externo (Google, GitHub).
  • Autorización (Authorization) — el proceso de verificar qué puedes hacer. Por ejemplo, acceder al panel de administración o la capacidad de eliminar publicaciones.


En TypeScript, estos procesos se implementan a través de middleware (manejadores intermedios) que verifican tokens o sesiones antes de ejecutar la solicitud.



Bibliotecas populares para TypeScript



Para implementar autorización y autenticación en proyectos TypeScript, se utilizan con mayor frecuencia:

  • jsonwebtoken — trabajo con JWT (JSON Web Tokens).
  • bcrypt — hashing de contraseñas.
  • passport (con tipos @types/passport) — middleware flexible para Express.
  • express-session — gestión de sesiones en el servidor.
  • crypto — módulo integrado de Node.js para trabajar con hashes.


Ejemplo práctico: autenticación JWT en TypeScript



Consideremos la creación de una API REST simple con autenticación mediante JWT. El ejemplo será con Express + TypeScript.



Paso 1. Instalación de dependencias

npm install express jsonwebtoken bcrypt dotenvnpm install -D typescript @types/express @types/jsonwebtoken @types/bcrypt ts-node nodemon


Paso 2. Configuración de TypeScript (tsconfig.json)

{  "compilerOptions": {    "target": "ES2020",    "module": "commonjs",    "outDir": "./dist",    "rootDir": "./src",    "strict": true,    "esModuleInterop": true  }}


Paso 3. Creación de middleware para autenticación

// src/middleware/auth.tsimport { Request, Response, NextFunction } from 'express';import jwt from 'jsonwebtoken';

interface UserPayload { id: string; email: string;}

// Extendemos la interfaz Request para almacenar datos del usuariodeclare global { namespace Express { interface Request { user?: UserPayload; } }}

export const authenticate = ( req: Request, res: Response, next: NextFunction): void => { const authHeader = req.headers.authorization;

if (!authHeader || !authHeader.startsWith('Bearer ')) { res.status(401).json({ message: 'Token no proporcionado' }); return; }

const token = authHeader.split(' ')[1];

try { const decoded = jwt.verify( token, process.env.JWT_SECRET || 'default_secret' ) as UserPayload; req.user = decoded; next(); } catch (error) { res.status(401).json({ message: 'Token inválido' }); }};


Paso 4. Middleware para autorización por roles

// src/middleware/authorize.tsimport { Request, Response, NextFunction } from 'express';

export const authorize = (...allowedRoles: string[]) => { return (req: Request, res: Response, next: NextFunction): void => { // Asumimos que el rol se almacena en req.user después de la autenticación const userRole = (req as any).user?.role || 'user';

if (!allowedRoles.includes(userRole)) { res.status(403).json({ message: 'Acceso denegado' });

Recommendations