Como funciona la web paso a paso, entiende el binomio cliente-servidor

Entiende de forma correcta como funciona una web, desde que el usuario entra en una url hasta que ve la página.

Cliente servidor Programacion web Apache Server

El binomio cliente-servidor es un concepto constante en la programación web, la relación entre el desarrollo back-end y front-end es un todo, y aunque es un concepto relativamente básico cuando se entiende, para el profano en el mundo de la programación y en especial el de la web puede ser complejo y algo confuso.

¿Cómo funciona el cliente-servidor?

Podemos referirnos a esta relación de "camaradería" entre las dos partes del desarrollo web: la comunicación entre un cliente y un servidor. Para que nos entendamos, existe un agente cliente que realiza peticiones de contenido (las webs en nuestro caso) y un agente servidor que a parte de almacenar los archivos de la web los puede "leer" o "interpretar".

La función del cliente es visualizar un contenido para su lectura interpretando los archivos e información que le ha pedido a un servidor y que este le ha enviado.

La función por parte del servidor es atender o escuchar (concepto técnico) las peticiones/solicitudes de clientes, que en un momento dado pueden ser uno o muchísimos de forma simultánea.

¿Quién es el cliente en la flujo web?

El cliente es el navegador web que tienes instalado y con el que visualizas esta página mientras lees mi contenido. Tu navegador tiene la capacidad de interpretar varios lenguajes de programación especialmente creados para la visualización y maquetación de contenido. 

Gracias a los lenguajes que puede interpretar, el navegador es capaz de por ejemplo:

  • Construir botones a partir de una etiqueta de HTML.
  • Cambiar el diseño de una parte de una parte de la web con tan solo pasar el ratón por encima.
  • Mostrar un color distinto en enlaces a páginas que ya has visitado almacenados en su memoria (cache).
  • Adaptar textos y elementos gráficos según el tamaño de la ventana de tu navegador con CSS.

¿Quién es el servidor en el flujo web?

El servidor es un software especializado para tal función instalado en un ordenador que se pasa el día encendido. El servidor se pasa las horas literalmente a la espera de recibir un contacto/llamada/petición a través de internet. 

El servidor, entre sus funciones principales tiene:

  • Alojar ficheros de todo tipo, desde imagenes a ficheros de programación o base de datos.
  • Interpretar ficheros con programación específica de servidor y contruir un fichero en base a esta
  • Enviar un mensaje de respuesta de tamaño variable, ya sea de error (código 404 por ejemplo) o de ok (código 200), con el contenido indicado por la programación que un administrador web.

¿Cómo se comunican el cliente y el servidor?

Cuando el servidor recibe una petición por parte de un cliente (puede estar en cualquier parte del mundo), realiza una serie de acciones normalmente programadas en un lenguaje de programación de servidor, y envía una respuesta http con el contenido de respuesta y unas cabeceras de comunicación, ya sean error o de ok todo ha ido bien.

Si por alguna razón el servidor estuviera "caído", es decir, apagado o fuera de servicio, el cliente recibiría una respuesta del proveedor de servicios de internet o de la empresa encargada de dar alojamiento a ese equipo. Esto se conoce comunmente como código 404 con el mensaje relacionado: la página no existe o ya no está disponible. 

Flujo de datos cliente-servidor paso a paso

Para finalizar todo este tutorial voy a explicar en orden como transcurriría el flujo de información desde el cliente al servidor y de vuelta. Veamos el proceso paso a paso de forma conceptual:

  1. El usuario de la web visita el enlace www.srcodigofuente.es.
  2. El navegador del usuario envía una petición http a la ip que corresponde a ese nombre de dominio. Del resto se encarga el proveedor de servicios.
  3. El servidor, si no esta caído, atiende a la petición del usuario.
  4. Como el usuario ha visitado la url raíz de mi sitio web, el servidor Apache realiza la acción por defecto: buscar el fichero index.php en mi directorio raiz de ficheros de la web.
  5. Apache abre el fichero y si por ejemplo el fichero tiene extensión .php lo explora por si tiene que ejecutar código de lenguajes de programación del lado del servidor (En caso de que el fichero fuera de extensión html, Apache (el servidor) realizaría el envío del fichero directamente ya que no tendría que leer código). 
  6. Al explorar el fichero, si se encuentra con lenguajes de programación del lado del cliente, estos serán ignorados, es decir, se los saltará, dejando esas líneas tal cual como están.
  7. Cada vez que el software servidor se encuentra con por ejemplo <?php (etiqueta que indica inicio de programación php) comienza a interpretar el código que encuentra en las líneas que le sigan, todas ellas líneas con programación de lado del servidor.
  8. El servidor ejecuta el código php, ignora cualquier lenguaje del lado del cliente que se encuentra y según avanza hacía el final del fichero, el código php, o cualquier otro lenguaje del lado del servidor, al haber sido interpretado, desaparecerá del documento final.
  9. Cuando Apache alcanza el final del fichero este lo envía al cliente como un mensaje de internet con unas cabeceras http. Así, el navegador de usuario que visitó el enlace de mi web, verá ahora una página HTML con lenguaje a interpretar y construirá un documento gráfico con el diseño correspondiente.
  10. Si la página tiene archivos conectados como hojas de estilo CSS, imagenes o librerías de lenguajes de programación del lado del cliente, el navegador realizará peticiones al servidor de los ficheros indicados.
  11. Si el documento recibido contiene programación del lado del cliente como javascript, es cuando puede ejecutarse código al ocurrir eventos programados relacionados con eventos producidos por acciones de usuario usuario. Los eventos abarcan desde un simple clic del usuario, la escritura de una letra o el fin de un determinado lapso de tiempo.

Todo este código final visualizado por tu navegador puedes verlo haciendo clic derecho y pinchando en ver código fuente de la página.

Sobre el autor

Javier Gómez Redactor en Srcodigofuente.es

Javier Gómez

Ingeniero técnico en informática de gestión. Desarrollador web freelance y profesor de desarrollo web a partes iguales. Testarudo autodidacta, creativo, perfeccionista y alma libre.

Cargando comentarios

Utilizamos "cookies" para información estadística. Si continúas navegando aceptas su uso.