Seguridad en Javascript: Lo que nadie te enseña, pero todos deberíamos saber

Cuando empecé a programar en JavaScript, me obsesioné con que todo “funcionara bien”: clicks que respondieran, formularios que se enviaran, animaciones suaves. Lo que no sabía en ese momento — y que me costó aprender a los golpes — es que hacer que algo funcione no es suficiente. Tiene que ser seguro.

En un mundo donde JavaScript está en todas partes (sí, hasta en tu tostadora si tiene WiFi), descuidar la seguridad es fatal. Así que si estás construyendo algo con JavaScript — ya sea un blog personal o una app que escale a millones de usuarios — este artículo es para ti.

Te comparto lo que considero los pilares básicos de seguridad en JavaScript, explicados como me hubiera gustado que me los explicaran a mí.

1. No confíes en los datos del usuario. Nunca.

La regla de oro. Y sí, suena obvio, pero es increíble la cantidad de código que he visto (incluyendo el mío del pasado) que asume que el usuario se va a portar bien.

Cuando escribes:

document.getElementById("saludo").innerHTML = inputUsuario;

Estás asumiendo que inputUsuario es texto limpio y amable. Pero ¿y si alguien mete esto?

<script>alert('XSS!')</script>

Felicidades, acabas de permitir un ataque XSS (Cross-Site Scripting). El navegador interpreta ese script como si fuera parte legítima de tu app. Y con eso, un atacante puede robar cookies, redirigir usuarios, o incluso comprometer cuentas.

¿Qué puedes hacer?
– Limpia el HTML antes de insertarlo. En vez de .innerHTML, prefiere .textContent si solo vas a mostrar texto.
– Usa herramientas como DOMPurify si necesitas insertar HTML y no puedes limpiar todo.
– Valida y sanitiza cada entrada de usuario, siempre. No importa si viene de un formulario, una API, o un WebSocket.

2. Cuida el backend tanto como el frontend

JavaScript no vive solo en el navegador. Si usas Node.js o cualquier framework como Express, también estás expuesto del lado del servidor.

Un error común es pensar que, porque el código del backend no lo ve el usuario, está a salvo. Pero si alguien encuentra una forma de interactuar con él (y créeme, lo intentarán), puede explotarlo.

Lo básico en backend seguro:

• Nunca uses eval(). Literalmente le estás dando al usuario el poder de ejecutar código arbitrario en tu servidor.
• Limpia inputs en consultas a la base de datos. Si usas MongoDB o SQL sin validación, podrías estar expuesto a inyecciones (revisa este artículo que escribí para profundizar sobre este tipo de ataques).
• Usa cabeceras de seguridad. Middlewares como helmet en Express te ayudan a configurar Content Security Policy, protección contra clickjacking, y más.

3. Autenticación ≠ Seguridad total

Sí, tener login con usuario y contraseña es importante. Pero eso no significa que ya estás seguro.

El problema está en cómo manejas la sesión. Si tu app guarda el token en localStorage, por ejemplo, un ataque XSS puede robarlo fácilmente.

Recomendaciones prácticas:

• Guarda tokens en cookies HttpOnly siempre que puedas.
• Implementa expiración de sesión y rotación de tokens.
• Usa OAuth o JWT con expiración corta y refresh tokens en servidores seguros.

4. Mantén tus dependencias bajo control

JavaScript tiene una comunidad inmensa, lo cual es increíble… hasta que instalas sin pensar. Sé que es algo sumamente obvio, pero considera que:

npm install paquete-random

¿Quién lo mantiene? ¿Hace cuánto no se actualiza? ¿Tiene vulnerabilidades conocidas? Un solo paquete comprometido puede darle acceso a todo tu proyecto a un atacante y hay varios casos en donde incluso atacantes han creado paquetes exclusivamente para vulnerar proyectos.

Por lo que:

• Usa herramientas como npm audit o snyk para detectar vulnerabilidades.
• Elimina dependencias que no estés usando. Menos código = menos superficie de ataque.
• Revisa el código de los paquetes si puedes (o al menos verifica que sean populares y mantenidos).

5. Vaciar variables sensibles después de usarlas

Supongamos que en algún momento del flujo cargas un token, una clave temporal o un ID de sesión para enviar a una API. Si esa variable permanece en memoria, podría ser inspeccionada o interceptada, especialmente si el navegador queda abierto o el usuario es víctima de un ataque XSS o malware local.

Buen hábito:

Setea esas variables a null o undefined tan pronto como dejen de ser necesarias.

let tempToken = await getTokenFromApi();
await fetchDataWithToken(tempToken);
tempToken = null; // Olvídate del token

Esto reduce la ventana de tiempo en la que un atacante podría explotar esa variable si logra acceso al entorno del navegador.

6. Usa el modo estricto y linter para prevenir fugas no intencionales

Si bien suena básico, aún hay muchos proyectos que no usan use strict ni herramientas como ESLint para controlar el scope de sus variables.

El modo estricto impide que variables no declaradas accidentalmente se vuelvan globales, lo que puede ser una fuente silenciosa de problemas.

"use strict";
someVar = 123; // ReferenceError, en lugar de colarse como global

Con ESLint, puedes incluso forzar políticas como:

• No permitir console.log en producción.
• No permitir el uso de variables globales.
• Prohibir el uso de eval() o Function() dinámicas.

7. Ofuscar tu código (aunque no es infalible)

Aunque no es una solución de seguridad por sí sola, ofuscar tu código puede agregar una capa extra de dificultad para quien intente analizarlo desde el navegador.

Herramientas como:

• UglifyJS
• Terser
• Webpack + plugins de minificación

…pueden ayudarte a reducir y ofuscar el código para que no sea legible fácilmente.

OJO:

Esto no reemplaza ninguna otra medida de seguridad. Nunca pienses que ofuscar es lo mismo que proteger. Solo estás dificultando un poco el trabajo de los curiosos.

8. Simula ataques y haz pruebas como si fueras el “malo”

Esta es probablemente la práctica más poderosa que puedes adoptar: actuar como un atacante.

Abre la DevTools (F12) en tu app y pregúntate:

• ¿Qué puedo ver?
• ¿Qué puedo modificar?
• ¿Qué puedo ejecutar?
• ¿Qué pasa si cambio el valor de este localStorage?
• ¿Qué sucede si fuerzo un nuevo token?
• ¿Puedo hacer un fetch con credenciales a otra ruta?

Finalmente, te dejo algunas herramientas útiles:

• OWASP ZAP: Escáner de seguridad para detectar vulnerabilidades web (en el corto plazo publicaré un artículo sobre esta herramienta)
• Burp Suite: Herramienta para interceptar tráfico entre tu navegador y tu backend.
• DevTools con ojos maliciosos: simplemente explora como si buscaras hackearte a ti mismo.

¡Espero te sirva! Nos leemos en un próximo artículo.