TryHackMe Poniendo todo junto – Putting it all together

Poniéndolo todo junto

En este capítulo, TryHackMe Poniendo todo junto – Putting it all together, vas a encajar todas las piezas: DNS, HTTP(S), servidores web, hosts virtuales, contenido estático vs. dinámico, balanceadores, CDN, bases de datos y WAF. Verás el viaje completo de una solicitud desde tu navegador hasta el backend y de vuelta al cliente. ¿Por qué es vital para tu carrera como hacker? Porque entender el flujo extremo a extremo te da un mapa mental para localizar cuellos de botella, puntos de control, superficies de ataque y controles de defensa. Con ese mapa sabrás dónde mirar, qué romper y cómo medir impacto sin perderte en detalles. Descubra cómo todos los componentes individuales de la web funcionan juntos para brindarle acceso a sus sitios web.

Cuando visitas un sitio web, ocurren muchos pasos invisibles:

1. DNS: El navegador necesita saber la IP del sitio web (traduce nombre de dominio a IP).
2. HTTP/HTTPS: Se realiza una solicitud al servidor web con este protocolo.
3. Servidor Web: Recibe la solicitud y responde con archivos HTML, CSS, JS, imágenes, etc.
4. Navegador (cliente): Interpreta los archivos y muestra el sitio web en pantalla.

Putting it all together – How the web works

Tarea 1 Poniéndolo todo junto

En los módulos anteriores, habrás aprendido que hay muchas cosas que suceden detrás de escena cuando solicitas una página web en tu navegador. En resumen, cuando accedes a un sitio web, tu equipo necesita conocer la dirección IP del servidor con el que se conecta; para ello, utiliza DNS . Tu PC se comunica con el servidor web mediante un conjunto especial de comandos llamado protocolo HTTP . El servidor web devuelve HTML, JavaScript, CSS, imágenes, etc., que tu navegador utiliza para formatear y mostrar el sitio web correctamente.

Tarea 2 Otros componentes

Balanceadores de carga

Cuando el tráfico de un sitio web aumenta considerablemente o se ejecuta una aplicación que requiere alta disponibilidad, es posible que un servidor web deje de funcionar. Los balanceadores de carga ofrecen dos funciones principales: garantizar que los sitios web con alto tráfico puedan gestionar la carga y proporcionar conmutación por error si un servidor deja de responder.

Cuando solicitas un sitio web con un balanceador de carga, este recibirá primero tu solicitud y la reenviará a uno de los múltiples servidores que lo respaldan. El balanceador utiliza diferentes algoritmos para decidir qué servidor es el más adecuado para procesar la solicitud. Algunos ejemplos de estos algoritmos son  «round-robin» , que envía la solicitud a cada servidor por turno, o  «weighted» , que verifica cuántas solicitudes está procesando un servidor y la envía al servidor con menos tráfico.

Los balanceadores de carga también realizan comprobaciones periódicas de cada servidor para garantizar su correcto funcionamiento; esto se denomina  comprobación de estado . Si un servidor no responde correctamente, el balanceador de carga dejará de enviar tráfico hasta que vuelva a responder correctamente.

CDN (Redes de distribución de contenido)

Una CDN puede ser un excelente recurso para reducir el tráfico a un sitio web concurrido. Permite alojar archivos estáticos de su sitio web, como JavaScript, CSS, imágenes y vídeos, en miles de servidores en todo el mundo. Cuando un usuario solicita uno de los archivos alojados, la CDN determina la ubicación física del servidor más cercano y envía la solicitud allí, en lugar de enviarla al otro lado del mundo.

Bases de datos

A menudo, los sitios web necesitan una forma de almacenar información para sus usuarios. Los servidores web pueden comunicarse con bases de datos para almacenar y recuperar datos. Las bases de datos pueden ir desde un simple archivo de texto sin formato hasta complejos clústeres de múltiples servidores que proporcionan velocidad y resiliencia. Encontrará algunas bases de datos comunes: MySQL, MSSQL, MongoDB, Postgres y más; cada una con sus características específicas.

WAF ( Firewall de aplicaciones web )

Un WAF se interpone entre tu solicitud web y el servidor web; su objetivo principal es protegerlo de ataques de hackers o denegación de servicio. Analiza las solicitudes web en busca de técnicas de ataque comunes, independientemente de si provienen de un navegador real o de un bot. También comprueba si se envía un número excesivo de solicitudes web mediante la limitación de velocidad, que solo permite una cierta cantidad de solicitudes por segundo desde una IP. Si una solicitud se considera un posible ataque, se descarta y nunca se envía al servidor web.

Responda las preguntas a continuación

¿Qué se puede utilizar para alojar archivos estáticos y acelerar la visita de un cliente a un sitio web?

CDN

¿Qué realiza un balanceador de carga para garantizar que un host siga activo?

health check

¿Qué se puede utilizar para ayudar contra el hackeo de un sitio web?

WAF

Tarea 3 Cómo funcionan los servidores web

¿Qué es un servidor web?

Un servidor web es un software que detecta conexiones entrantes y utiliza el protocolo HTTP para entregar contenido web a sus clientes. Los servidores web más comunes son Apache , Nginx, IIS y NodeJS. Un servidor web entrega archivos desde su directorio raíz, definido en la configuración del software. Por ejemplo, Nginx y Apache comparten la misma ubicación predeterminada: /var/www/html en sistemas operativos Linux , mientras que IIS usa C:\inetpub \ wwwroot en sistemas operativos Windows. Por ejemplo, si solicita el archivo   http://www.example.com/picture.jpg , enviará el archivo /var/www/html/picture.jpg desde su disco duro local.

Hosts virtuales

Los servidores web pueden alojar varios sitios web con diferentes nombres de dominio; para ello, utilizan hosts virtuales. El software del servidor web comprueba el nombre de host solicitado en los encabezados HTTP y lo compara con sus hosts virtuales (los hosts virtuales son simplemente archivos de configuración de texto). Si encuentra una coincidencia, se proporcionará el sitio web correcto. Si no encuentra ninguna coincidencia, se proporcionará el sitio web predeterminado.

Los hosts virtuales pueden tener su directorio raíz asignado a diferentes ubicaciones en el disco duro. Por ejemplo, one.com se asigna a /var/www/website_one y two.com a /var/www/website_two.

No hay límite en la cantidad de sitios web diferentes que puedes alojar en un servidor web.

Contenido estático vs. contenido dinámico

El contenido estático, como su nombre indica, es contenido que nunca cambia. Ejemplos comunes son imágenes, JavaScript, CSS, etc., pero también puede incluir HTML que nunca cambia. Además, estos son archivos que se sirven directamente desde el servidor web sin modificaciones.

El contenido dinámico, por otro lado, es contenido que puede cambiar según las solicitudes. Por ejemplo, un blog. En la página principal, se muestran las últimas entradas. Si se crea una nueva entrada, la página principal se actualiza con ella. Otro ejemplo podría ser la página de búsqueda de un blog. Según la palabra que busques, se mostrarán diferentes resultados.

Estos cambios en lo que ves se realizan en el  backend  mediante lenguajes de programación y scripting. Se llama backend porque todo lo que se hace se realiza en segundo plano. No puedes ver el código HTML de los sitios web y ver lo que sucede en el backend, mientras que el HTML es el resultado del procesamiento del backend. Todo lo que ves en tu navegador se llama  frontend.

Lenguajes de scripting y backend

No hay muchos límites para lo que un lenguaje de backend puede lograr, y estos son los que hacen que un sitio web sea interactivo para el usuario. Algunos ejemplos de estos lenguajes (sin ningún orden en particular :p) son PHP , Python , Ruby, NodeJS, Perl y muchos más. Estos lenguajes pueden interactuar con bases de datos, llamar a servicios externos , procesar datos del usuario y mucho más. Un ejemplo básico de PHP sería solicitar el sitio web   http://example.com/index.php?name=adam

Si index.php se construyó así:

<html><body>Hello <?php echo $_GET[«name»]; ?></body></html>

Esto le enviaría al cliente lo siguiente:

<html><body>Hello adam</body></html>

Notarás que el cliente no ve ningún código PHP porque está en el  backend . Esta interactividad plantea muchos más problemas de seguridad para las aplicaciones web que no se han creado de forma segura, como aprenderás en los siguientes módulos.

Responda las preguntas a continuación

¿Qué utiliza el software de servidor web para alojar varios sitios?

Virtual Hosts

¿Cómo se llama el tipo de contenido que puede cambiar?

Dynamic

¿El cliente ve el código del backend? Sí/No

Nay

Tarea 4 Prueba

El cuestionario

Haz clic en el botón «Ver sitio» a la derecha. Con todo lo aprendido en los otros módulos, arrastra y suelta los mosaicos en el orden correcto de cómo funciona una solicitud a un sitio web para mostrar la bandera.

Nota : Al colocar un mosaico en la posición correcta, se resaltará en verde. Si está en el lugar incorrecto, se resaltará en rojo. ¡ No actualice la página, ya que se borrarán todos los mosaicos!

Responda las preguntas a continuación

Bandera

THM{YOU_GOT_THE_ORDER}

Resumen del capítulo — De la URL al HTML renderizado (y todo lo que pasa entre medio)

• 1) Resolución y conexión
  • DNS traduce dominio → IP del servidor/servicio (a veces del balanceador o CDN).
  • El navegador abre conexión y habla HTTP(S) para pedir recursos.
• 2) Puertas de entrada y distribución
  • Balanceador de carga recibe la petición y la reparte con algoritmos (round-robin, weighted).
    • Hace health checks y saca de rotación servidores caídos.
  • CDN sirve estáticos (CSS/JS/imagen/video) desde el edge más cercano reduciendo latencia y carga al origen.
• 3) Capa de aplicación
  • Servidor web (Nginx/Apache/IIS/Node) decide qué sitio entregar vía Virtual Hosts (por Host:).
  • Contenido estático sale directo del document root.
  • Contenido dinámico lo genera el backend (PHP, Python, Node, Ruby, etc.) que puede:
    • leer parámetros (GET/POST),
    • llamar servicios externos,
    • consultar bases de datos (MySQL, PostgreSQL, MSSQL, MongoDB…).
• 4) Seguridad en el perímetro y el camino
  • WAF inspecciona solicitudes (patrones de ataque, rate-limit) y bloquea lo sospechoso antes de tocar la app.
  • TLS/HTTPS cifra tráfico y valida identidad del servidor.
• 5) Respuesta y render
  • El servidor devuelve HTML + CSS + JS (y otros assets); el navegador construye DOM/CSSOM, ejecuta JS y pinta la página.
• Claves de pentesting que se desprenden del flujo
  • Dónde interceptar: CDN (cabeceras/cache), balanceador (comportamientos diferenciales), server web (vhosts, rutas), backend (parámetros), DB (inyecciones).
  • Qué observar: códigos de estado, redirecciones, encabezados de seguridad, separación estático/dinámico, patrones de caché, diferencias entre sitios por Host.
  • Qué probar: parámetros en endpoints dinámicos, políticas del WAF (bypass), exposición de estaticos sensibles, enumeración de vhosts, fallos de sesión en capas distribuidas.

 Componentes adicionales que intervienen

Componente	Función	Ejemplo/Detalle
CDN (Content Delivery Network)	Aloja y distribuye archivos estáticos (imágenes, JS, CSS, etc.) desde servidores cercanos al usuario.	Acelera la carga del sitio.
Balanceador de carga	Distribuye el tráfico entre varios servidores para evitar sobrecarga y permitir alta disponibilidad.	Algoritmos: round-robin, least-connections, etc.
Health Check	Técnica usada por balanceadores para verificar que un servidor está activo y operativo.	Si falla, deja de enviarle tráfico.
Base de datos	Almacena datos dinámicos del sitio (usuarios, productos, etc.)	Ej: MySQL, PostgreSQL, MongoDB
WAF (Web Application Firewall)	Filtra y bloquea solicitudes maliciosas antes de que lleguen al servidor web.	Protege contra XSS, SQLi, DDoS, etc.

Cómo funcionan los servidores web

¿Qué es un servidor web?

Software que entrega contenido web a los usuarios. Ejemplos:

• Apache
• Nginx
• IIS
• NodeJS

📂 Ubicación típica de archivos:

• Linux: /var/www/html
• Windows: C:\inetpub\wwwroot

Hosts virtuales (Virtual Hosts)

Permiten que un solo servidor aloje múltiples sitios web.

Ejemplo:

• one.com → /var/www/website_one
• two.com → /var/www/website_two

Tipos de contenido

Tipo	Qué es	Ejemplos
Estático	No cambia, se sirve tal cual está guardado	HTML fijo, CSS, imágenes, JS
Dinámico	Se genera en tiempo real, cambia según el usuario o la situación	Páginas con resultados, perfiles de usuario, etc.

Backend vs. Frontend

Concepto	Qué hace	Visible al usuario
Frontend	Todo lo que ve el usuario en el navegador (HTML, CSS, JS)	✅ Sí
Backend	Lógica, procesamiento de datos, conexión a bases de datos, seguridad	❌ No

🔧 Lenguajes backend comunes: PHP, Python, Ruby, Node.js, Perl

Ejemplo PHP:

<html><body>Hello <?php echo $_GET[«name»]; ?></body></html>

Al visitar example.com/index.php?name=adam, el usuario verá:

<html><body>Hello adam</body></html>

Lo que te llevas

Ahora entiendes el circuito completo: del DNS al WAF, del balanceador al servidor web, del backend a la base de datos, y de vuelta a tu navegador via CDN. Con este mapa podrás:

• priorizar pruebas según la capa (perímetro, app, datos),
• diferenciar problemas de red, de configuración o de lógica,
• explicar impacto con claridad (qué componente falla y por qué),
• y optimizar tu recon para atacar donde más duele.

Sigue practicando el orden de la cadena (resolución → entrada → procesamiento → respuesta) y piensa cada vulnerabilidad en qué tramo rompe. Si dominas el recorrido, dominas el terreno. ¡A la próxima sala con esa mentalidad de arquitecto y atacante a la vez! 🚀