PDF de programación - HTML

HTTP

Sistemas Telemáticos para Medios Audiovisuales

GSyC

Departamento de Teoría de la Señal y Comunicaciones y

Sistemas Telemáticos y Computación

Noviembre de 2015

GSyC - 2015

HTTP

1

©2015 Grupo de Sistemas y Comunicaciones.
Algunos derechos reservados.
Este trabajo se distribuye bajo la licencia
Creative Commons Attribution Share-Alike
disponible en http://creativecommons.org/licenses/by-sa/3.0/es

GSyC - 2015

HTTP

2

Contenidos

Introducción

1

2 Relación entre HTTP y conexiones TCP

3 Formato de mensajes HTTP

4 Caché de contenidos en HTTP

5 Proxies de HTTP

6 Cookies

7 HTTPS

8 HTTP 2.0

9 Referencias

GSyC - 2015

HTTP

3

Introducción

Contenidos

Introducción

1

2 Relación entre HTTP y conexiones TCP

3 Formato de mensajes HTTP

4 Caché de contenidos en HTTP

5 Proxies de HTTP

6 Cookies

7 HTTPS

8 HTTP 2.0

9 Referencias

GSyC - 2015

HTTP

4

Definiciones

Introducción

URL (Universal Resource Locator)
Interfaz común para acceder a diferentes tipos de
servicios/documentos en Internet a través de un sistema de
nombres.

HTML (HyperText Markup Language)
Lenguaje de marcado para la elaboración de contenidos integrados
por texto, gráficos, etc, que permite incluir en un documento
referencias a otros recursos mediante URLs

HTTP (HyperText Transfer Protocol)
Protocolo entre navegadores y servidores WWW para transferir
recursos hipermedia (texto, gráficos, audio, vídeo).

GSyC - 2015

HTTP

5

URL

Introducción

Protocolo: Protocolo por el que se accede al recurso. Por
defecto el predeterminado para la aplicación que usa la URL.
Máquina: Máquina en la que reside el recurso. Por defecto la
máquina local.
Puerto: Puerto de la máquina a través del que se pide el
recurso. Por defecto el predeterminado para el protocolo
(http=80)
Recurso: Identificación del recurso dentro de la máquina,
incluyendo (a veces) un path. Por defecto el recurso
predeterminado para la máquina.
Identificador de fragmento: Opcionalmente, se utiliza para
identificar un fragmento del recurso.

GSyC - 2015

HTTP

6

h"p://www.urjc.es:80/alumnos/horarios/index.html#ref1<Protocolo'Máquina'Puerto'Recurso'Iden4ficador'de'fragmento' HTML

Introducción

GSyC - 2015

HTTP

7

Visor de HTML

Introducción

GSyC - 2015

HTTP

8

HTTP

Introducción

Protocolo de nivel de aplicación utilizado para
transferir recursos hipermedia entre ordenadores.
Sigue el modelo Cliente-Servidor:

Cliente HTTP: navegador web que pide páginas
y, al recibirlas, las muestra al usuario. Ej: Firefox,
Explorer, Chrome, Safari. . .
Servidor HTTP: servidor web en el que están
alojadas páginas que piden los clientes. Ej:
Apache, IIS. . .

Funciona sobre TCP como protocolo de transporte
Por defecto un servidor HTTP escucha en el puerto
80, pero puede usar cualquier otro puerto.
HTTP puede servir tanto contenido estático
(ficheros) como contenido dinámico (el resultado
de ejecutar programas en el servidor).

GSyC - 2015

HTTP

9

HTTP$TCP$IP$Ethernet$ Versiones de HTTP

Introducción

0.9: Primera versión documentada, no tiene número de versión
oficial, pero es referida como versión 0.9 (1991)
1.0: Primera versión oficial (RFC 1945, año 1996)
1.1: Versión “clásica” (RFC 2068, año 1997 y RFC 2616, año
1999)
2.0: Versión “nueva” (RFC 7540, junio 2015)

Soportado en las versiones actuales de todos los navegadores
Soportado por el 2 % de los servidores HTTP actuales (según
W3Tech)

GSyC - 2015

HTTP

10

Relación entre HTTP y conexiones TCP

Contenidos

Introducción

1

2 Relación entre HTTP y conexiones TCP

3 Formato de mensajes HTTP

4 Caché de contenidos en HTTP

5 Proxies de HTTP

6 Cookies

7 HTTPS

8 HTTP 2.0

9 Referencias

GSyC - 2015

HTTP

11

Relación entre HTTP y conexiones TCP

Páginas web

Una página web se compone de uno o más recursos.
Cada recurso suele ser un archivo, y hay recursos de distinto
tipo (archivos HTML, imágenes PNG, vídeos AVI, applets
Java, etc)
A un recurso se hace referencia a través de su URL.
La mayoría de las páginas web están formadas por un archivo
HTML base y varios recursos referenciados dentro de ese
archivo base como contenido adicional de la misma página.

Ej: Una página web puede estar compuesta por 6 recursos: 1
fichero HTML y 5 imágenes PNG.

GSyC - 2015

HTTP

12

Relación entre HTTP y conexiones TCP

Petición de una página web de un sólo recurso

El tiempo total mide lo que se tarda en tener el recurso en el cliente
(para mostrarlo, p.ej), por lo que el tiempo de cerrar la conexión no
cuenta.

GSyC - 2015

HTTP

13

Cliente'Servidor'SYN'SYN+ACK'ACK'Pe3ción'del'recurso'Envío'del'recurso'FIN'ACK'FIN+ACK'RTT'RTT'TTrmRec'Tiempo'Total'RTT:'Round'Trip'Time'(3empo'de'ronda)'''''(depende'de'la'latencia'entre'C'y'S)'TTrmRec:'Tiempo'de'Transmisión'del'recurso''''''(depende'del'ancho*de*banda'entre'C'y'S)' Relación entre HTTP y conexiones TCP

Una página con 5 recursos: Conexiones NO Persistentes

Una vez que el cliente tiene el recurso principal, lo analiza y abre con
el servidor conexiones en paralelo con la actual para pedir los 4
recursos adicionales.

GSyC - 2015

HTTP

14

Cliente'Servidor'Tiempo'Total'Cliente'Servidor'Cliente'Servidor'Cliente'Servidor'Cliente'Servidor'Tiempo'Total'='4*RTT'+'Tpo.'Trm.'todos'los'recursos'Conexión'1'Conexión'2'Conexión'3'Conexión'4'Conexión'5'Los'recursos'transmiAdos'en'paralelo'se'reparten'el'ancho'de'banda'disponible'Un'recurso'transmiAdo'él'solo'aprovecha'todo'el'ancho'de'banda'disponible' Relación entre HTTP y conexiones TCP

Una página con 5 recursos: Conexiones Persistentes

Una vez que el cliente tiene el recurso principal, lo analiza y pide por la
misma conexión los 4 recursos adicionales, que se envían en paralelo.
Es 1 RTT más rápido que con conexiones persistentes.

GSyC - 2015

HTTP

15

Cliente'Servidor'Tiempo'Total'Tiempo'Total'='3*RTT'+'Tpo.'Trm.'todos'los'recursos'Conexión'1'Los'recursos'transmi>dos'en'paralelo'se'reparten'el'ancho'de'banda'disponible'Un'recurso'transmi>do'él'solo'aprovecha'todo'el'ancho'de'banda'disponible' Relación entre HTTP y conexiones TCP

Conexiones Persistentes con recursos en servidores diferentes

En cuanto al menos un recurso adicional esté en otro servidor será
imprescidible abrir una nueva conexión, lo que introduce el RTT
adicional.

GSyC - 2015

HTTP

16

Cliente'Servidor'1'Tiempo'Total'Tiempo'Total'='4*RTT'+'Tpo.'Trm.'todos'los'recursos'Conexión'1'Los'recursos'transmi>dos'en'paralelo'se'reparten'el'ancho'de'banda'disponible'Un'recurso'transmi>do'él'solo'aprovecha'todo'el'ancho'de'banda'disponible'Cliente'Servidor'2'Conexión'2' Relación entre HTTP y conexiones TCP

Detalles del tiempo de respuesta de un recurso HTTP

Búsqueda en el DNS: Depende del RTT de acceso al
servidor de DNS de la máquina, y del tiempo que tarda en
encontrar la respuesta el servidor de DNS.
Establecimiento de la conexión TCP: Depende del RTT de
acceso al servidor web.
Solicitud de HTTP: Depende del RTT de acceso al servidor
web.
Respuesta de HTTP: Depende del ancho de banda entre el
cliente y el servidor web. Si el recurso es grande, este tiempo
es el más grande, si el recurso es pequeño, este tiempo es el
más pequeño.

GSyC - 2015

HTTP

17

Relación entre HTTP y conexiones TCP

Tiempo de carga de página: Ingeniería de “usabilidad”

Tiempo de carga de página (Page Load Time)
Tiempo desde que el usuario hace clic en un enlace hasta que ve la
página pedida “razonablemente” completa.

Tiempo
0 - 100 ms
100 - 300 ms
300 - 1000 ms

1 - 10 s
> 10 s

Reacción del usuario

carga instantánea

sensación de lentitud

espera apreciable

cambio de contexto mental

abandono de la página

Se considera importante mantenerse por debajo de los 250 ms
para que la navegación sea fluida.
Valores experimentales medios a día de hoy:

RTT: 100 ms
Tiempo de carga de página: 7 s (mediana: 3 s)
Valores aún peores usando dispositivos móviles.

GSyC - 2015

HTTP

18

Relación entre HTTP y conexiones TCP

Tiempo de carga de página: cómo mejorarlo

El tiempo de carga de página depende sobre todo del RTT, y
no tanto del ancho de banda.
El RTT depende de la latencia, no del ancho de banda
(básicamente, RTT = 2 ∗ latencia)
A día de hoy, mejorar el ancho de banda ya no mejora el
tiempo de carga de la página. Hay que trabajar en el RTT:

reduciendo la latencia
minimizando el número de RTTs necesarios para cargar la
página

GSyC - 2015

HTTP

19

Tiempo'de''carga'de'página'Ancho'de'banda'1.5$s$3$Mbps$Tiempo'de''carga'de'página'RTT'1.0$s$140$ms$4.0s$2.5$s$40$ms$240$ms$ Relación entre HTTP y conexiones TCP

Valores típicos en una aplicación web hoy

Carga de la página principal de una aplicación web:

90 solicitudes de HTTP, obtenidas de 15 servidores, 1300 KB
transferidos, 3 segundos:

HTML: 10 solicitudes, 52 KB
Imágenes: 55 solicitudes, 812 KB
JavaScript: 15 solicitudes, 216 KB
CSS: 5 solicitudes, 36 KB
Otros: 5 solicitudes, 195 KB

GSyC - 2015

HTTP

20

Formato de mensajes HTTP

Contenidos

Introducción

1

2 Relación entre HTTP y conexiones TCP

3 Formato de mensajes HTTP

4 Caché de contenidos en HTTP

5 Proxies de HTTP

6 Cookies

7 HTTPS

8 HTTP 2.0

9 Referencias

GSyC - 2015

HTTP

21

Formato de mensajes HTTP

Formato general de los mensajes

Los clientes envían mensajes llamados peticiones
Los servidores envían mensajes llamados respuestas
Todos los mensajes tienen un formato de texto: Un mensaje es una colección de
líneas de texto.
Cada línea de texto es un conjunto de caracteres terminado por un carácter especial
“fin de línea” o por la pareja de caracteres <CR><LF>.
Formato:

GSyC - 2015

HTTP

22

iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii"hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh"hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh"hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh"hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh"hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh""bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb"bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb"bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb"bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb