La Arquitectura de las Aplicaciones de Internet

The Architecture of Internet Applications

Prof. Juan QuemadaUPM

Friday, March 4, 2011

El Modelo Cliente - Servidor

Programación de aplicaciones distribuidas en TCP/IP 4Clientes: dan acceso a los servicios

4Servidores: proveen datos, información, servicios, ...• Son públicos (dirección fija y conocida: URL, ..)

Cliente y Servidor son roles en una aplicación4Un ordenador puede ser cliente y servidor simultaneamente

Conexión


Servicios TCP-UDP/IP

Servicio TCP4Servicio fiable orientado a conexión

• Denominado también de “circuitos virtuales”

Servicio UDP4Servicio no fiable de envío de datagramas (paquetes)

• Puede haber perdida, desorden o duplicación de datagramas

4Denominado también servicio “sin conexión” (connectionless)


Dirección de Máquina y de Aplicación

Dirección IP (o de red): 4identifica una máquina (host)

• 192.2.3.122, 98.8.77.66, ...• dit.upm.es, google.com, ..• “localhost” (mi maquina): 127.0.0.1

Puerto: dirección de aplicación4Tienen 16 bits de longitud

• Los servidores usan direcciones prefijadas– HTTP: puerto 80– Daytime: puerto 13

...

...

Ordenador(host)

red

...

Aplic. 1dir. IP ...

puerto 0

puerto n

Aplic. 2


Arquitectura TCP/IP

5


Circuitos Virtuales y Sockets TCP

Socket TCP: transporte fiable de datos4orientado a conexión

• Las conexiones se denominan tambien circuitos virtuales

Cada circuito transporta datos de forma fiable4Envía flujos de datos, streams de bytes4Garantiza la entrega

• pero no un plazo de entrega

4Imposibilidad de entregar los datos • provoca la liberación del circuito

Conexión (circuito virtual)


Puertos y ServidoresCada “puerto” se asigna a un servidor

4Una misma maquina puede albergar varios servidores• En puertos diferentes

Los clientes tambien utilizan “puertos” 4Se suelen asociar solo para un acceso al servidor

...

...

máquina servidora

red ... ...

puerto 0

...

máquina de cliente

...

progr.serv. l

progr.serv. n

...cliente

m dir. IP1

dir. IP2 ...

puerto 0

puerto n


Sockets TCP de servidor y cliente

Existen 2 tipos de sockets4Socket de servidor

• Espera solicitudes de establecimiento de conexión– Las acepta cuando llegan si tiene recursos

4Socket de cliente• Gestiona la conexión, tanto en el cliente, como en el servidor

Un servidor acepta múltiples conexiones4Una para cada cliente que se conecte

• Cada conexión posee una cola de información independiente




Las aplicaciones de Internet


Las Aplicaciones de InternetLas aplicaciones son el motor del tráfico de Internet: Las mas usadas: Web (23%), P2P (23%) y Video (51%)

El mayor incremento de tráfico actual se debe al Video IP: YouTube, streaming, IP TV, …

Tráfico P2P y el Web estan perdiendo peso en el porcentaje global, aunque no importancia


Las primeras aplicaciones de InternetEl éxito de Internet se debe a sus aplicaciones

El carácter abierto de Internet produjo nuevas aplicaciones Los usuarios las creaban extendiendo aplicaciones existentes

e-mail: Evolución de mensajería entre usuarios de “mainfarmes” FTP (Transferencia de Ficheros): Evolución de COPY Otros:

Terminal Virtual, News, Gopher (pre–Web), ….

Los S.O. de entonces eran orientados a comando

Intercambian datos en ASCII (o ristras de octetos) Son legibles y fáciles de procesar

pero la compresión no es óptima11


Correo electrónico

Correo electrónico (email) Primer motor de uso de Internet

Todavía es una de las aplicaciones más utilizadas

Envía un mensaje electrónico entre dos buzones Dirección de buzón/usuario: “[email protected]”

Protocolo SMTP (Simple Mail Trans. Prot., RFC821) Con el tiempo surgen otros protocolos: POP3, IMAP, ...

12


mailto:[email protected]

mailto:[email protected]

Ejemplo de mensaje

Asunto: Se han integrado los tunelesDe: Enrique Lopez <[email protected]>Fecha: Tue, 11 Sep 2007 10:49:08 +0200Para: [email protected], ....Message-ID: <[email protected]>Agente de usuario:: Thunderbird 1.5.0.13 (X11/20070824)…….Content-Length: 532

Hola a todos:

Esta mañana he terminado de integrar ……………..........Un saludoEnrique

Formato de mensaje definido en RFC 822 (1982) Solo permite texto ASCII en Cabecera y Cuerpo

Línea en blanco: separa Cabecera de Cuerpo


MIME

MIME (Multipurpose Internet Mail Extensions) Mensajes como acarreadores de contenidos

Múltiples formatos: texto, imágenes, aplicaciones, … Contenidos no-ASCII se encapsulan y se trans-codifican en

hexadecimal, uuencode, base 64, …

Definido en RFCs 2045-6, 2077, 3023, …. http://www.iana.org/assignments/media-types/

El uso de MIME se ha extendido a otros ámbitos: HTTP y Web, S.O., ...

14


http://www.iana.org/assignments/media-types/


Extensiónes MIME

MIME introduce 5 nuevos campos en un mensaje MIME-Version: indica la versión MIME utilizada

Ejemplo: “MIME-Version: 1.0” (acorde RFC1521) Content-Type: indica el tipo de contenido acarreado

Ejemplo: “Content-Type: text/html” Content-Transfer-Encoding: de octetos a ASCII

Códigos típicos: hexadecimal, uuencode, base 64, … Ejemplo: “Content-Transfer-Encoding: base64”

Content-ID: identificador único en la redEjemplo: “Content-ID: <[email protected]>”

Content-Description: texto descriptivo Ejemplo: “Content-Description: Pagina de prueba del servicio”


Tipos de contenidos MIMECampo Content-Type Tiene dos partes: tipo / subtipo

Tipos: “application”, “audio”, “image”, “message”, “model”, “multipart”, “text”, “video”,

extension-token IANA coordina la definicion de nuevos tipos/subtipos


Ejemplos: image/gif, image/jpeg, image/png, ... text/plain, text/html, message/rfc822, ...... application/postcript, application/msword, application/x-www-form-urlencoded, multipart/form-data, ...




Ejemplo de mensajeAsunto: Se han integrado los tunelesDe: Enrique Lopez <[email protected]>Fecha: Tue, 11 Sep 2007 10:49:08 +0200Para: [email protected], ....Message-ID: <[email protected]>Agente de usuario:: Thunderbird 1.5.0.13 (X11/20070824)MIME-Version: 1.0Content-Type: text/plain; charset="iso-8859-1"Content-Transfer-Encoding: 8bit…….Content-Length: 532

Hola a todos:

Esta mañana he terminado de integrar ……………..........Un saludoEnrique


Los 90: El WebInventado/propuesto por Tim Berners Lee (1989)

Es el almacén de contenidos que la red necesitaba Crece incesantemente hasta convertirse en

el mayor repositorio de información que haya existido nunca

Es un Servicio “Abierto”, “Escalable” y “Descentralizado” para Publicación de documentos “hypertexto” en la red

Alta usabilidad: “se navega haciendo click en enlaces”

Permite modelar las relaciones sociales Es un universo de mundos interconectados

Cada página es el comienzo de un mundo El dueño (autor) publica y enlaza con otras páginas libremente

18


Navegación Web: URLs, HTTP y HTML

Cada página HTML se identifica por un URL, por ejemplo http://mail.google.com/PaginaWeb.html

Cliente Web

Servidor Web

HTTP (URL)

El cliente recibe

y presenta página HTML

en Visor..

Servidor envía pag.

Web a cliente.

ClienteSolicita pag.con click en hiperenlace

HTTP - GET PaginaWeb.html HTTP 1.1

<PaginaWeb.html>


Los componentes del primer WebURI (URL) Dirección en la red de un documento o recurso

Ejemplo: http://www.upm.es/centros/etsit/personal.html Los hiperenlaces modelan

Relaciones o interacciones entre personas, información, empresas, … ¡¡Todo recurso Web posee un URL que lo identifica!!

HTML Lenguaje abierto de

descripción de documentos hipermedia, formularios, … ¡¡Permite navegación Web muy sencilla!!

HTTP Protocolo transaccional genérico

Protocolo sin estado (Stateless) -> ¡¡Servidores y servicio escalables!!

20


http://www.upm.es/centros/etsit/personal.html

http://www.upm.es/centros/etsit/personal.html

Evolución: Aplicaciones WebAplicaciones de servidor El Web permite acceso remoto a aplicaciones interactivas

Consulta y actualización de bases de datos

Aplicaciones de cliente HTML no es suficiente

Hay que mejorar la experiencia de usuario (velocidad, interactividad) Aparecen: CSS, Javascript, XML, AJAX, ....

“RIA: Rich Internet Applications” (Flex) Arquitecturas de objetos distribuidos (nuevo paradigma)

21

HTTP (URL)

HTML, XML, ..


El Web• En 1989 Tim Berners Lee comienza el desarrollo del Web

– Nivel que permite construir aplicaciones• Se convierte en el interfaz universal de acceso a aplicaciones


Clientes Web: Visor o NavegadorPrograma de acceso al Web Mucha funcionalidad y complejidad

Presentan HTML, XML o CSS, ejecutan Javascript, .... Se estan convirtiendo en S.O. Ejemplos: Explorer, Firefox, Chrome, Safari, Opera, …

23


Servidor WebGestor de recursos Web con HTTP Deben ofrecer servicios escalables que atiendan muchos usuarios

Servicios en la nube (cloud-computing) Google, Apple o Amazón tienen granjas de miles de servidores

Servicios en Ruby on Rails, Java Restlet, PHP Symphony, ..... Ejemplos: Apache, Tomcat, Microsoft IIS, …

24


Las grandes empresas de Internet uClizan “Cloud CompuCng” y suelen revenderlo como servicio: Amazon, Google, Facebook, Yahoo, Youtube, …

Paradigma emergente de creación de servicios escalables, fiables, …… y baratos– Con acceso ubicuo y global a través de Web– Minimiza costes con componentes baratos

– Utilizando tecnologías de virtualización

Cloud Compu)ng (Computación en la Nube)


Amazon Cloud Compu-ng Services

• La Nube permite crear servicios virtualizados

– Pago por uso, sin inversión inicial• Solo 3ene costes variables

– Accesible con interfaz Web Services

• Amazón Web Services

– Plataformas virtualizadas:• Servidores, computo, bases de datos, …

– Oferta variada: • S3, EC2, SQS, RDS, Elas3c Map-‐Reduce, ….


Mobile Internet Compu2ng


Terminales: evolución


Los componentes del Web: Resources, URL, HTML, CSS, Javascript, HTTP, ...


Recursos y URLs

Un recurso es cualquier cosa en Internet que “merezca la pena ser referenciada por si misma”

Un fichero, un mapa, un libro, una foto, un video, una base de datos, …..

Cada recurso se identifica con un URI El URI identifica y da acceso al recurso (HTTP)

El URI define también el formato del recurso

Un recurso debe tener un formato “conocido” Texto ASCII, HTML, XML, JSON, ….


URL: ejemplos

<prot>:<//><authority>/<path>?<query>#<frag> <authority> = <UserInfo@><host><:port>

prot: protocolo o esquema de acceso: http:, mailto:, ftp:, telnet:, ..

authority: identificación de servidor (host), puerto (port) y usuario Dirección de correo electrónico: mailto:[email protected] URLs Web con dominio o IP: http://dit.upm.es, http://138.15.12.223:8080

path: identificación de recurso (dentro el servidor) URL Web: http://www.bb.es/archivo/doc1.html URL de fichero: file:///usr/lib/registro.txt

query: Define valores de parámetros en formularios URL Web: http://www.bb.es/foto?nombre=Paco&apellido=Perez

frag: sección de un recurso (se denomina también: anchor, fragment, ref, …) URL Web: http://www.bb.es/archivo/doc1.html#seccion


Identificación de recursos

URI: Identificador de recurso uniforme Uniformiza el acceso a cualquier recurso de Internet

Definido en: RFC 2396 (98), RFC 2732 (99) y RFC 3986 (05) T. Berners-Lee, R. Fielding, L. Masinter, B. Carpenter

http://www.faqs.org/rfcs/rfc2396.html http://www.faqs.org/rfcs/rfc3986.html

Tipos de URI URL: Uniform Resource Locator

Localiza un recurso unívocamente en un lugar físico de la red Lugar físico: Recurso en un “host” de Internet

URN: Uniform Resource Name Nombre de un recurso, independiente de posición Se definió en la norma, pero se utiliza escasamente


http://www.faqs.org/rfcs/rfc2396.html




Tecnologías de cliente para “Web as platform” Paradigma de aplicaciones desplegadas desde un servidor

Soportadas en visores Web: IE, Firefox, Safari, Chrome, ......

Tecnologías mas importantes HTML(HyperText Markup Language), HTML5

Lenguaje de marcado de texto para definir su estructura CSS (Cascading Style Sheets)

Lenguaje de definición de presentación visual Javascript

Lenguaje de programación de aplicaciones de cliente

Plataforma HTML o (HTML5)

33


Lenguaje de marcado: Define la estructura de un documento con marcas de texto

SGML (Standard Generalized Markup Language) Utilizado por la industria editorial: Norma ISO 8879:1986

HTML (HyperText Markup Language) Documentos Web con hiperenlaces, derivado de SGML Evolución de HTML

IETF publica: HTML (1993) y HTML2 (1995) W3C publica: HTML3.2 y 4.0 en 1997 y HTML 4.01 en 1999

Se promueve XHTML hasta 2008 W3C estima: HTML5 en 2012 (candidate rec.) y 2022 (prop. rec.)

Tutorial: http://www.dit.upm.es/~santiago/docencia/master/web/web.html http://www.w3schools.com/html/

Lenguaje de Marcado HTML

34


http://jungla.dit.upm.es/~santiago/docencia/master/web/web.html


http://www.w3schools.com/html/


Marcado HTML Las marcas delimitan el principio y fin de un elemento: <TITLE> Titulo .. </TITLE> <H1> Cabecera nivel 1 </H1>, ...

Las marcas pueden llevar atributos <A HREF="http://www.dit.upm.es"> Dept. Ing. Telemática</A>

Algunas marcas de HTML pueden omitir el terminador <P> indica separador de párrafo en HTML

En XML, XHTML el terminador es obligatorio </P> o se puede utilizar una marca con sintaxis especial <P />

Algunos tutoriales http://www.dit.upm.es/~santiago/docencia/master/web/web.html http://www.w3schools.com/html/ http://www.html.net/tutorials/html/


http://www.dit.upm.es

http://www.dit.upm.es





http://www.html.net/tutorials/html/

http://www.html.net/tutorials/html/

Ejemplo de pagina HTML <HTML> <HEAD><TITLE>Ejemplo página HTML</TITLE></HEAD>

<BODY> 

<H1> Ejemplo de Cabecera </H1>

Acceda al <A HREF="http://www.w3schools.com/html/"> tutorial de HTML de W3C Schools</A>. <p>

A continuación aparece una lista y una tabla

<UL id="lista" > <LI> elemento <FONT COLOR=red>rojo</FONT> </LI> <LI> elemento <STRONG>en negrita</STRONG> </LI><LI> elemento <SUB>con subíndice</SUB> </LI></UL>

<TABLE BORDER id="tabla"> <TR> <TD>Primera celda <br> de la tabla</TD> <TD><IMG SRC="iconos.gif"></TD> </TR> <TR> <TD>Celda 21</TD> <TD>Celda 22</TD> </TR></TABLE>

</BODY> </HTML>


Elementos HTML del ejemplo<HTML>: declaración de página HTML<HEAD>: cabecera no visible<BODY>: cuerpo visible<H1>: titulo de nivel 1

Sub-niveles: <H2>, <H3>, …<A HREF="http://....>: hipervínculo

El URL va en el atributo HREF <P> párrafo

Ejemplo de atributo: ALIGN=“center”<UL>: lista no numerada<OL>: lista numerada<LI>: elemento de lista <OL> o <UL><DL> Lista definida:

Tipo de elemento <dt> .... </dt> Definición de elemento <dd> ... </dd>

<.... id=“referencia”> fragment referencia a este elemento en URL como: #referencia

<FONT>: tipo de fuente<STRONG>: resaltar, mas fuerte que el resto

Otros: <SMALL>, <BIG>, <TT>, <Q>, ..<SUB>: subíndice

Superíndice: <SUP><TABLE BORDER>: definicion de tabla con borde

BORDER es un atributo opcional<TR>: fila de tabla<TD>: celda de tabla<IMG src=”URL”>: imagen

El URL de la imagen va en el atributo SRC

El ejemplo ilustra

Texto EnlacesListas Tablas

Se pueden encontrar masdetalles sobre HTML oXHTML en el Tutorial.

Forms y objetos (ejecutables)de ven más adelante. No serecomienda usar Frames.


HTML

HEAD BODY

TITLE

Ejemplo página HTML

H1 <!– --!>

Ejemplo decabecera

Accedaal A P

A cont. .....una lista y una tabla

UL TABLE.

HREF= http://ww ..” LI

FONT

COLOR=”red” rojo

LI

elemento STRONG

en negrita

LI

SUB

con subíndice

TR TR

TD TD TD TD

Primera celda BR de la

tabla IMG Celda21

Celda22

Esto es un comentario

Árbol sintáctico del ejemploÁrbol sintactico: Árbol definido por anidamientos de marcas

Cada bloque (<..> …. <..>) es un sub-arbol 3 tipos principales de nodos:

elemento: amarillo atributo: rosa texto: blanco

BORDERTutorial de

HTML de W3CSchools

elemento elemento

SRC=“Icono.gif”


http://ww

Representación en arbol de HTMLUn marcado HTML bien construido genera un arbol sintactico Es utilizado por programas y herramientas para procesar HTML

Javascript: lenguaje para procesar paginas Web en HTML CSS: lenguaje de visualización “bonita” de páginas HTML

Un marcado bien construido debe anidar unas marcas dentro de otras Preservando la estructura de arbol

Ejemplo de marcado correcto: <H1> El <EM> Titulo </EM> es lo mas <B> importante </B> </H1>

Nunca deben solapse Ejemplo de marcado erróneo:

<H1> El <EM> Titulo </EM> es lo mas <B> importante </H1> </B>

DOM: Document Object Model API Javascript para acceder al arbol sintáctico de HTML


Javascript


JavascriptJavascript Lenguaje por excelencia de aplicaciones de cliente Sintaxis muy similar a Java

Pero la semantica es diferente Nombre:

inicialmente “LifeScript”, pasó a “JavaScript” al triunfar Java

Lenguaje de scripting integrado en código HTML Diseñado para ser ejecutado en el visor Web

Interprete analiza el código fuente Javascript Si es correcto lo ejecuta, sinó genera una excepción

Tutoriales http://wwwwww.dit.upm.es/~santiago/docencia/master/web/web.html http://www.w3schools.com/js/, http://www.w3schools.com/jsref/




http://www.w3schools.com/js/

http://www.w3schools.com/js/

http://www.w3schools.com/jsref/

http://www.w3schools.com/jsref/

Ejemplo Javascript: Factorial<html><head><title> Ejemplo 1 Javascript</title></head>

<body><h2> Tabla de Factorial </h2>

  

<script> var fact = 1; // Define variable fact y asigna el entero 1

for(i = 1; i < 10; i++) { // bucle for similar a Java fact = fact*i; // calcula el factorial iterativamente document.write(i + "! = " + fact + "<br \\/>") ; // Inserta string (argumento) en codigo HTML // Transformación automatica de enter (i, fact) a string }</script>

</body></html>


Ejemplo Javascript: Fecha

<html><head><title> Hora y Fecha</title></head>

<body><h1>The date and time are:</h1>

<script language="JavaScript"> document.write(new Date( )); // Date(): objeto predefinido // al crearlo se inicializa con fecha y hora actual</script>

</body></html>


HTML5


1999: HTML deja de actualizarse por W3C W3C promueve XHTML (redefinición de HTML en XML)

Sustitución muy compleja -> no aceptada por usuarios XHTML tiene demasiadas variantes:

transitional, frameset, strict, basic, .......

Aparecen tecnologías propietarias para nuevas aplicaciones Adobe Flash

para Webs dinámicas con gráficos bonitos para video

Se consolida plataforma HTML Javascript, CSS, XML, JSON, ...

XML y XHTML


2004: Desarradores de “Browsers” crean WHATWG Para definir nueva versión de HTML: HTML5

Debido a la no actualización de HTML en W3C

Objetivo HTML5: Desarrollo de nueva versión de HTML para aplicaciones Web actuales y futuras

2008: W3C finaliza actividad en XHTML 2 Debido a rechazo de fabricantes de browsers

2008: W3C confluye con WHATWG y HTML5 Publica “Working Draft” de HTML5 en W3C

Calendario de HTML5 2012: Candidate Recommendation 2022: Proposed Recommendation

HTML5


HTML5: Primera revisión de HTML en una década Para diseñar las aplicaciones Web mas avanzadas

video, redes sociales, móviles, juegos, gráficos, 3D, .. Sustituira a: HTML4, XHTML1.0 y DOM2-HTML

http://www.w3schools.com/html5/ http://diveintohtml5.org/table-of-contents.html http://www.w3.org/TR/html5/

Soporte a HTML5 debe preceder a las normas (y validarlas) Alto soporte en Firefox, Safari, Chrome, Opera, IE, ..

http://en.wikipedia.org/wiki/Comparison_of_layout_engines_%28HTML5%29

HTML4 Polyglot Subconjunto compatible con HTML y XHTML (transicional)

Características HTML5


http://www.w3schools.com/html5/default.asp

http://www.w3schools.com/html5/default.asp

http://en.wikipedia.org/wiki/HTML5

http://en.wikipedia.org/wiki/HTML5

http://www.w3.org/TR/html5/

http://www.w3.org/TR/html5/



Paginas Web bien estructuradas

Formularios muy enriquecidos

Gráficos vectoriales

Formulas matematicas

CANVAS para juegos y animaciones

Geolocalicación y sensores

Video y audio nativo

Almacenamiento de datos local y en BD

Web & Offline Web workers

.......

Plataforma HTML5: principales novedades


HTML5: se diseño como plataforma en WHATWG Incluyendo todos los componentes

marcas HTML, APIs Javascript y comandos CSS Partes iniciales de HTML5 son ahora normas separadas

Almacenamiento local (Local storage) Web Sockets Geolocation SVG MathML HttpXMLRequest Level 2 microdatos ......

Plataforma HTML5 Todo lo necesario para crear nuevas aplicaciones sin plugins

Paradigma “Web as Platform”:

Plataforma HTML5


*From Peter Lubers, Kaazing: HTML5 The 30,000’ View, http://www.slideshare.net/peterlubbers/html5-4378635


*From Peter Lubers, Kaazing: HTML5 The 30,000’ View, http://www.slideshare.net/peterlubbers/html5-4378635


Listado de marcas de HTML5 incluyendo las nuevas y las deprecadas:por Antonio Lupetti http://woorkup.com/wp-content/uploads/2009/12/HTML5-Visual-Cheat-Sheet.pdf


HTTP


HTTP


Métodos mas utilizados GET: Pedir un fichero al servidor

Se invoca desde HTML HEAD: Pedir la cabecera de un fichero al servidor POST: Enviar un formulario al servidor

Se invoca desde HTML PUT: Cargar un recurso en el servidor DELETE: Borrar un recurso del servidor

Otros métodos OPTIONS: Determinar que métodos acepta un servidor TRACE: Trazar mensaje a través de proxies hasta el servidor CONNECT: Conectar a un servidor a través de un proxy

Metodos de HTTP


Transacción HTTP GET

GET /index.html HTTP/1.0Accept: text/html, text/plain, image/gif, image/jpegUser-Agent: Netscape-Navigator/4.03 // linea en blanco indica final de cabecera // POST y PUT pueden llevar cuerpo

HTTP/1.0 200 OKServer: NCSA/1.2.3Content-type: text/htmlContent-length: 608 // tamaño cuerpo en bytes // linea en blanco hace de separador entre cabecera y cuerpo pregunta<html>....... // fichero html</html>

Acceso a página Web -> http://scom.dit.upm.es/index.html


http://scom.dit.upm.es/index.html

http://scom.dit.upm.es/index.html

Formato de cabeceras HTTP GET

HTTP/1.1 200 OK

Server: Apache/1.3.6 (Unix)Content-type: text/html, …Content-length: 608

<html> …….. </html>

1) Solicitud del Cliente

2) Respuesta del Servidor: scom.dit.upm.es

Comienzo

Cabecera

Cuerpo

Acceso a página Web -> http://scom.dit.upm.es/lib/ej.html

GET /lib/ej.html HTTP/1.1

Host: scom.dit.upm.es Accept: text/*, image/*Accept-language: en, spUser-Agent: Mozilla/5.0 (WinNT)

Comienzo

Cabecera

Cuerpo

Comando, camino-recurso, versión-HTTP

Sentencias de cabecera: dan información al servidor

GET no incluye cuerpo en la solicitud

Versión-HTTP, resultado, frase-adicional

Sentencias de cabecera: dan información al cliente

Cuerpo con fichero HTML


Cabeceras HTTP POST

HTTP/1.1 200 OK

Server: Apache/1.3.6 (Unix)MIME-version: 1.0Content-type: text/html, …Last-modified: Wed, 14-Mar-95 18:15:23 GMT Content-length: 608

<html> …….. </html>

1) Solicitud del Cliente

2) Respuesta del Servidor: scom.dit.upm.es

Comienzo

Cabecera

Cuerpo

<FORM METHOD=post ACTION="http://scom.dit.upm.es/cgi-bin/aut">

POST cgi-bin/aut HTTP/1.1

Host: scom.dit.upm.es Accept: text/*, imag/gif, image/jpeg, imag/pngAccept-language: en, spUser-Agent: Mozilla/5.0 (WinNT)Content-type: application/x-www-form-urlencodedContent-length: 30

color=blue&msg=Deje+su+mensaje

Comienzo

Cabecera

Cuerpo


Figura tomada de “HTTP: The Definite Guide” de D. Gourley & B. Toty


Carga de una página típica

Un pagina (X)HTML contiene habitualmente otros objetos que se cargan en transacciones separadas. Conexiones persistentes y transacciones concurrentes aceleran mucho la

descarga de la página completa

Pagina Objetos asociados


Conexión persistente y en paralelo

La conexión TCP en HTTP 1.1 es persistente Queda establecida al finalizar una transacción

Hasta que cliente o servidor solicitan el cierre con Connection: close

Permite múltiples transacciones con una única conexión TCP

Las conexiones HTTP 1.0 no son persistentesSe puede mantener la conexión TCP establecida con

Connection: keep-alive

HTTP 1.1 permite transacciones en paralelo (pipelined) Una transacción puede comenzar sin que finalice la anterior

La finalización de las transacciones debe seguir el orden de comienzo Aumenta mucho la velocidad de carga de páginas Web


Ejercicio aplicación-2• Installar Mozilla Firefox y añadirle el Add-On “Live HTTP

Header” que permite ver las cabeceras HTTP intercambiadas con un servidor. Acceder a un servidor e interpretar las cabeceras intercambiadas.

• Hacer un telnet al puerto 80 y simular comandos HTTP introduciendolos a través del teclado > telnet <host> <port> ....


Rest: Restful Web Services


ÍndiceREST o WSPrincipios de REST Direccionabilidad Interfaz uniforme Sin estado Representación abierta Hipertexto

Conclusiones


Servicios o Recursos



Que es REST


REST: Principios


Interfaz uniforme


Ejemplo: Amazon S3Servicio de almacenamiento de objetos: “Disco Virtual”Arquitectura Cloud Computing http://aws.amazon.com/s3/

Autenticación: “AWS Access Key” o “Certificado X.509”Tiene 3 tipos de recursos:

Bucket-list: conjunto de buckets* de un usuario https://s3.amazonaws.com/

Bucket en particular: repositorio de objetoshttps://s3.amazonaws.com/{Bucket}/

Objeto: posee metadato y valorhttps://s3.amazonaws.com/{Bucket}/{Objeto}

*Bucket: disco o repositorio virtual accesible a través de HTTP


http://aws.amazon.com/s3/

http://aws.amazon.com/s3/

REST, reu-lización y mashups


Cachés y Gestión del tráfico Web


Los Clicks y el tráfico de InternetCada click en un URL de una página Web

Desencadena una acceso Web (HTTP)

El tráfico actual de Internet se mide en clicks Es decir: Transacciones HTTP

Todos los portales de Internet Intentan maximizar el número de accesos recibidos

Sus ingresos de publicidad dependen del número de accesos

Atractores de clicks El tráfico (clicks) depende de los enlaces a una página

Desde blogs, Google o sistemas de recomendación


Descargas de Páginas Web


Optimización del TráficoSe realiza con caches en dispositivos proxy o pasarela

Interceptan los accesos Y sirven el contenido solicitado de la cache, si no ha cambiado en el servidor

Una cache se situa en ciente, servidor o punto intermedio estratégicoProxy: dispositivo intermedio elegido por el cliente Pasarela: dispositivo intermedio elegido por el servidor o la red

Figura tomada de “HTTP Developer’s Handbook” de Chris Shiflett


Identificador de recurso: Etag

HTTP/1.1 304 Not Modified

Content-type: text/html, …Content-length: 0Date: Wed, 03 Jul 2002, 19:18:23 GMTEtag: “V45789099”Cache-Control: max-age=36000 // cachear 36000 segundos

2) Respuesta confirmando

Comienzo

Cabecera

Cuerpo



Accept: text/*Accept-language: en, spIf-None-Match: “V45789099”

Comienzo

Cabecera

Cuerpo

1) Solicitud condicional de recurso


Control de Última Modificación

HTTP/1.1 304 Not Modified

Content-type: text/html, …Content-length: 0Date: Wed, 03 Jul 2002, 19:18:23 GMTExpires: Fri, 05 Jul 2002, 19:18:23 GMT

2) Respuesta confirmando

Comienzo

Cabecera

Cuerpo



Accept: text/*Accept-language: en, spIf-Modified-Since: Wed, 21 Jun 2002, 12:11:23 GMT

Comienzo

Cabecera

Cuerpo

1) Solicitud condicional de recurso


Gestión de Cache

Las cabeceras informan al gestor de una cache si los recursos son “frescos” o “caducados”

Cabeceras de gestión de cache mas comunes If-Non-Match: <versión Etag de un recurso> // Cliente Etag: <version del objeto para determinar si ha cambiado> // Servidor

If-Modified-Since: <Enviar solo si modificado desde xxx> // Cliente Last-Modified: <Fecha de ultima de última modificación> // Servidor

Cache-Control: max-age=3600 // Servidor Otros parametros de Cache-Control:

max-age=0 // no guardar no-store // no guardar No-cache // guaradar, pero no utilizar sin comprobar que


Redes de Distribución de Contenidos

• Internet no fue diseñada para realizar transacciones

– TCP/IP es muy ineficaz para esta funcion

• No opCmiza el tráfico

– Se diseño para crear aplicaciones extremo-‐a-‐extremo

• Clientes dialogan con el servidor

• Son necesarias CDNs (Content Delivery Networks)

– OpCmizan el uso del ancho de banda con “caches”

• Evitando retransmiCr el mismo recurso– Cada vez que lo pide un usuario


Future Internet


Internet del Futuro y la Arquitectura de Internet

Red 1 .... Red n


Internet del Futuro

• Cada vez existe mayor conciencia sobre la necesidad de

– Redefinir Internet y TCP/IP

• Para opCmizar la distribución de contenidos– Dilema: “Evolu@on” o “Revolu@on”

– Van Jacobson, Agosto 2006: • h=p://video.google.com/videosearch?q=van+jacobson&emb=0&aq=f#

• Todos los países han creado programas de invesCgación

– Centrados en crear la Internet del Futuro

• Aunque nadie sabe como será realmente


http://video.google.com/videosearch?q=van+jacobson&emb=0&aq=f#

http://video.google.com/videosearch?q=van+jacobson&emb=0&aq=f#

Technology

La Arquitectura de las Aplicaciones de Internet