Arquitectura de la Web y Computación en el Servidor

Arquitectura de la Web yComputación en el Servidor

Jose Emilio Labra GayoDepto. Informática

Universidad de Oviedo

Pilares de la Web3 pilares

Interacción: Protocolos HTTP, FTP, SMTP, etc.Identificación: URIsFormatos de representación: HTML, JSON, XML, ...

IdentificaciónURI

FormatosHTML, JSON,...

IdentificaciónURI

InteracciónProtocolos

FormatosHTML, JSON,...

WWW

Protocolos: HTTP

HTTP (Hypertext Transfer Protocol)Versión 0.9 (1991)HTTP 1.0 (1996) desarrollado por HTTP WG (IETF)HTTP/1.1 (1999) RFC 2616

Modo textoArquitectura de la Web

SPDY (2009) GoogleHTTP/2.0 (2015)

Cabeceras comprimidas, formato binarioObjetivo: rendimiento

https://tools.ietf.org/html/rfc2616

Esquema conceptual de HTTP

Usuario NavegadorCliente

Servidor

URI

Representación

WWWHTTP

Petición

Respuesta

RecursosLa Web está formada por recursosRecurso = cualquier fuente de contenido Web

Se identifican mediante URIs

Diversas Posibilidades:Estáticos: almacenados en Sistema de Ficheros

Páginas HTMLOtros formatos multimedia: Imágenes, vídeos, sonidos, ...

Dinámicos: bajo demandaGenerado a partir de bases de datosIntegrando información de otros servicios WebInformación onlineNOTA: La mayoría de la información disponible en la Web se

genera dinámicamente

Recursos

NavegadorCliente

Servidor

URI

WWWHTTP

Fichero texto

Imagen

Basedatos

Programa

Sistema ficheros

=

Gateway

Gateway

Gateway

GatewayOtro servidor

CámaraWeb

Base datos

Informac.Bursátil

ControlRobot

Tipos de recursosLos servidores asocian un tipo a cada recurso

Tipos MIME (Multipurpose Internet Mail Extensions)

Ejemplos: text/plain, text/html, application/xml, image/jpg,...

El cliente decide qué hacer con dichos tipos

UsuarioNavegador

ClienteServidor

Petición

Respuesta

WWWHTTP

Content-type: image/jpegContent-length: 8854

HTTP: Formato de mensajesModo texto: línea inicial

cabecera del mensaje*cuerpo del mensaje ?

NavegadorCliente

Servidor

Petición

WWWHTTP

HTTP/1.1 200 OKDate: Thu, 12 Oct 2013 09:36:05 GMTServer: ApacheContent-length: 80554Content-type: text/html; charset=utf-8<html> <head> <title>Curso XML</title> <head> ...</html>

GET /index.html HTTP/1.1Host: www.uniovi.esUser-Agent: Mozilla/5.0 …Accept: text/htmlAccept-language: es, en

Respuesta

Mensajes de peticiónFormato general:

POST /admin HTTP/1.1Host: www.uniovi.esUser-Agent: Mozilla/5.0 …Accept: text/htmlAccept-language: es, en...datos POST...

<method> <url> <version><headers> *<entity-body>

GET /index.html HTTP/1.1Host: www.uniovi.esUser-Agent: Mozilla/5.0 …Accept: text/htmlAccept-language: es, en

<headers> = parejas de la forma: nombre1: valor1 nombre2: valor2

<method>= GET,PUT,POST,DELETE,...

Ejemplos:

HTTP/1.1 200 OKDate: Thu, 12 Oct 2013 09:36:05 GMTServer: ApacheContent-length: 80554Content-type: text/html; charset=utf-8<html> <head> <title>Curso XML</title> <head> ...</html>

Mensajes de respuestaFormato general:

HTTP/1.1 404 Not foundContent-length: 0

<version> <status> <reason-phrase><headers> *<entity-body>

<Status>Códigos estándar: 2**: Variaciones de OK3**: redirecciones4**: Problemas del cliente5**: problemas del servidor

Ejemplos:

Utilidades

Diversas utilidadescurl http://curl.haxx.se/Hurl http://hurl.itRedbot http://redbot.orgWeb-sniffer: http://web-sniffer.net/RestClient http://code.google.com/p/rest-client/

curl http://cursoxml.herokuapp.comAlgunas opciones: -v (verbose) -H (cabeceras) -X (verbos POST, PUT, DELETE,...)

CURLEjemplos:

curl http://cursoxml.herokuapp.com

curl -H "Accept-language:es" http://cursoxml.herokuapp.com

curl -H "Accept:text/html" http://cursoxml.herokuapp.com/search?course=html5

curl -H "Accept:application/xml" http://cursoxml.herokuapp.com/search?course=html5

curl -X POST http://cursoxml.herokuapp.com/login -d email="[email protected]" -password="abc"

Métodos HTTPGET: Solicita una representación de un recursoPUT: Crear un recursoPOST: Envía datos para que un recurso los procese

Puede implicar la creación/actualización de recursos

DELETE: Elimina un recursoOtros

HEAD: Similar a GET, pero obtiene únicamente la cabeceraTRACE: Pide la solicitud que se envió al servidorOPTIONS: Solicita los métodos que soporta el servidorCONNECT: Convierte la petición en un túnel TCP/IP

Facilita la comunicación a través de SSL

Métodos HTTP

PropiedadesMétodo Bases de

datos*Función Segura? Idempotente?

PUT Create Crear recurso No SI

POST Update Actualizar No No

GET Retrieve Consultar recurso Si Si

DELETE Delete Eliminar recurso No Si

* Aunque son similares, las operaciones CRUD de bases de datos y los métodos GET, PUT, POST y DELETE de HTTP no son idénticos

Cabeceras en la peticiónAccept: Tipos de representaciones aceptablesAccept-charset: Conjunto de caracteres aceptableAccept-encoding: Codificación de caracteres aceptableAccept-language: Idiomas aceptablesAuthorization: Indicar credenciales de autorizaciónCache-control: Especificar directivas para controlar la cacheConnection: Tipo de conexión preferidaCookie: Cookie enviada previamente por el servidorContent-length: Longitud de la peticiónContent-type: Tipo MIME del cuerpo de la peticiónDate: Fecha/hora de la solicitudIf-Modified-Since: Permite enviar código 304 No modificado si no se ha modificado el contenido desde una fechaIf-None-Match: Permite enviar código 304 No modificado (ETag)User-Agent: Identifica el tipo agente de usuario utilizado. . .

Respuestas HTTP

EjemploHTTP/1.1 200 OKDate: Fri, 17 Nov 2006 15:36:32 GMTServer: ApacheLast-Modified: Fri, 17 Nov 2006 09:05:32 GMTContent-length: 43305Content-type: text/html<!DOCTYPE html><html> …</html>

Cabeceras en la respuestaContent-type: Tipo MIME de la respuestaCache-control: Especificar directivas para controlar la cacheContent-encoding: Tipo de codificación utilizado en el mensajeContent-language: Idioma utilizado en el mensajeContent-length: Tamaño del mensajeContent-location: Localización alternativa de los datos devueltosDate: Fecha/hora de la respuestaETag: Identificador de la versión de un recursoExpires: Fecha a partir de la cual el contenido puede eliminarse de la cachéServer: Identifica el tipo de servidorSet-cookie: Activa una cookie en el clienteWWW-Authenticate: Indica el esquema de autentificación a utilizar. . .

Recursos

Recurso = Unidad básica de la WebCualquier cosa que se identifique con una URI

URI ≠ Recurso ≠ RepresentaciónURI

http://tiempo.com/Asturias/Oviedo

Identifica

Metadatos: Content-type: text/html

Datos:<html> <head><title>Tiempo</title></head> <body> <h1>Tiempo en Oviedo</h1> <p>Nubes y claros</p></body></html>

Representa

Representación

Recurso

Tiempo en Oviedo

¿Qué se puede identificar con una URI?

Cualquier cosa concreta o abstracta

http://www.uniovi.es

<!DOCTYPE html><html> <head> <title>Universidad de Oviedo</title> </head> <body> <h1>Universidad de Oviedo</h1> <p>Fundada en el año 1608 en <a href="http://www.wikipedia.org/Oviedo"> Oviedo</a></p> . . .</body></html>

identifica

Ejemplo: Una página Web

Una página WebRecurso de información

Formato HTML



http://www.di.uniovi.es/~labra/images/asturias.jpg

identifica

Ejemplo: Una fotografía (recurso multimedia)

Una fotografíaRecurso de información

Formato JPG



http://www.w3.org/People/Berners-Lee/card#i

identifica

Ejemplo: Una persona

Una persona (Tim Berners-Lee)Recurso de no información



http://xmlns.com/foaf/0.1/Person

identifica

Ejemplo: Conjunto de todas las personas

Conjunto de Personas (concepto abstracto)Recurso de no información



http://purl.org/dc/terms/creator

identifica

Ejemplo: Propiedad de creación

Propiedad de creación (concepto abstracto)Recurso de no información



http://purl.org/dc/terms

identifica

Ejemplo: Espacio de nombres

Espacio de nombres (concepto)Recurso de no información

creator title

subject

contributor

created

datedescription

format

languagemodified

publisher

rights . . .

Formato de una URI

Más información: Especificaciónhttp://tools.ietf.org/html/rfc3986

esquema://autoridadcamino?consulta#fragmento

http://ejemplo.com:8042/libros/castellano?autor=Cervantes#capitulo2

Otros ejemplos de URIs:ftp://ftp.is.co.za/rfc/rfc1808.txt mailto:[email protected] telnet://192.0.2.16:80/ urn:oasis:names:specification:docbook:dtd:xml:4.1.2

Nota: Significado especial de espacios, ?, /, etc.

Nota: las URNs identifican nombres únicos solamente. Sin protocolo

Partes de una URI

Más información: Especificaciónhttp://tools.ietf.org/html/rfc3986

Nota: las URNs identifican nombres únicos solamente. Sin protocolo

esquema autoridad//usuario@host:port

path querystring fragment

httphttphttpftpmailtourn

//localhost:3000//google.com//uniovi.es///[email protected]:045125021

/about//course/view.php/rdf/rfc1808.txt

?a=1&b=2?q=pepe?id=4590

?subject=Curso

#historia

http://localhost:3000/about?a=1&b=2#historiahttp://google.com/?q=pepehttp://uniovi.es/course/view.php?id=4590ftp://ftp.is.co.za/rdf/rfc1808.txtmailto:[email protected]?subject=cursourn:isbn:045125021

Ejemplos

DereferenciaciónDereferenciar una URI = Acceder al contenido de una URI

Obtener una representación del recurso identificado por la URI

Habitualmente se utiliza protocolo HTTPPueden existir diferentes representacionesLa representación puede incluir enlaces a otras URIs con información relacionada

Principio: Follow your nose (“Sigue tu instinto”)

A partir de una URI, se puede ir encontrando más información y más recursos relacionados fácilmente y de casualidad (serendipia)

Estabilidad de las URIsURIs = pilar fundamental de cualquier aplicación WebObjetivo: Esquema de URIs estableLema: Cool URIs don’t change

Modificar una URI puede romper aplicaciones existentesEvitar URIs que dependen de detalles de implementación

Ejemplo: http://156.35.41.34:8080/pagina.php

Importancia de nombres adecuados para URIshttp://www.w3.org/Provider/Style/URI

URI

Formatos de Representación

Formatos de representaciónEn la Web, el formato más habitual es HTML

Existen muchos más formatos: XML, JSON, RDF, PNG, …Un recurso puede tener diferentes tipos de representaciónCada tipo de representación sirve para un propósito

HTMLTipo de representación más popular en la WebObjetivo: representar hipertextoEjemplo:

<!DOCTYPE html><html><head><title>Pedido</title><meta charset="utf-8" /> </head><body><h1>Pedido</h1><table><tr><th>Código</th><th>Nombre</th><th>Cantidad</th><th>Comentarios</th></tr><tr><td>R23</td><td>Rotulador RX2</td><td>20</td><td>Comprobad que escriben</td></tr><tr><td>G56</td><td>Grapadora Lin</td><td>2</td><td>Envuelta para regalo</td></tr></table><p>Más información: <a href="http://empresa.com">Empresa</a></body></html>

XMLFacilita intercambio de información

Objetivo: procesamiento automáticoComercio electrónico

<?xml version="1.0"> <pedido> <producto codigo="R23"> <nombre>Rotulador RX2</nombre> <cantidad>20</cantidad> <comentarios>Comprobad que escriben</comentarios> </producto> <producto codigo="G56"> <nombre>Grapadora Lin</nombre> <cantidad>2</cantidad> <comentarios>Envuelta para regalo</comentarios> </producto></pedido>

JSONFacilita intercambio de información

Objetivo: procesamiento automáticoServicios Web { "pedido": [

{ "type": "producto", "codigo": "R23", "nombre": "Rotulador RX2", "cantidad": 20, "comentarios": "Comprobad que escriben" }, { "type": "producto", "codigo": "G56", "nombre": "Grapadora Lin", "cantidad": 2, "comentarios": "Envuelta para regalo" } ]}

RDFPermite integración de información

Integración automática de los datosObjetivo: Evitar ambigüedad en cadenas de texto

@prefix rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#> .@prefix schema: <http://schema.org/> .@prefix : <http://example.org/> .@prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#> .

:pedido a schema:Order ; schema:orderedItem [ :code "R23"; schema:name "Rotulador RX2"; rdfs:comment "Comprobad que escriben"; schema:orderQuantity 20 ] ; schema:orderedItem [ :code "G56"; schema:name "Grapadora Lin"; rdfs:comment "Envuelta para regalo"; schema:orderQuantity 2 ] .

Tipos de representaciónLos tipos de representación se identifican con MIMEMIME (Multipurpose Internet Mail Extensions)

Identificar el tipo de contenido (Cabecera Content-type)Formato tipo/subtipoEjemplos:

text/html: Página Web en formato HTMLtext/xml, application/xml : Documento XMLapplication/json: Documento JSONapplication/pdf: Fichero PDFimage/jpeg: Imagen JPEGapplication/xhtml+xml: Documento XHTMLapplication/rdf+xml: Documento RDFtext/turtle: Documento Turtle. . .

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

Funcionamiento de la Web2 computadores conceptuales: Cliente y Servidor

La representación puede calcularse dinámicamenteComputación en ClienteComputación en servidor


Servidor

URI

Representación

WWWHTTP

Cliente

También se conoce como Agente de UsuarioNormalmente es un navegador (browser)Múltiples tipos de agentes de usuarios y navegadores

Navegadores: Internet Explorer, Chrome, Firefox, Lynx, …Dispositivos móvilesLectores de pantallaeBooksTVs…

Componentes de un navegadorInterfazAnalizadorMotor visualizaciónIntérprete ECMAScript procesa eventos y modifica árbol

Usuario

NavegadorCliente

URI

Representación

WWWHTTP

Analizador

ÁrbolDOM

MotorVisualizaciónInterfaz

Usuario

Intérprete ECMAscript

URI

Componentes de un ServidorLa arquitectura del servidor depende de muchos factoresDescomposición habitual

Vista: Se encarga de preparar la representaciónNegocio: Gestión de objetos de negocioDatos: Modelos de datos

CapaVista

CapaNegocio

URI

CapaDatos

Representación

URI

WWWHTTP

Computación en Servidor

Contenido es generado dinámicamente1. Llega la petición al servidor 2. El servidor analiza parámetros de petición

Verbo (GET, PUT, POST, ...), Ruta (URI), Cabeceras, Entorno

3. Servidor "computa" y envía una respuesta


Servidor

URI

Representación

WWWHTTP

Petición

Respuesta

MétodoURIHeadersEnvironment

Múltiples alternativas

CGIsLenguajes específicos para Web: PHPLenguajes dinámicos: Perl, Python, Ruby,...Javascript en servidor: NodejsLenguajes generales compilados

JVM: Java (JSP, Servlets,...), Scala, GroovyCLR: C# (ASP.Net), F#, ...

Otros: Frameworks, CMS, etc.

CGI

CGI (Common Gateway Interface), 1.1 (2004)Método estándar para transmitir parámetros entre servidor y programas ejecutables

Nombres de variablesSERVER_NAME, SERVER_SOFTWARE, GATEWAT_INTERFACESERVER_PROTOCOL, REQUEST_METHOD, QUERY_STRING,...

Los programas CGIs son ejecutados por el servidorDevuelve la respuesta de la ejecución

Otras variantes: FastCGI (optimiza creación de procesos)

http://tools.ietf.org/html/rfc3875

PHP

Lenguaje interpretado por el servidorEl código se incrusta en HTML mediante marcas especiales

Cuando el servidor reconoce código PHP:Llama al intérpreteEjecuta el códigoDevuelve el resultado

Según w3techs, el 81.1% de los sitios Web utiliza PHP

http://w3techs.com/technologies/details/pl-php/all/all

Lenguajes dinámicos

Python, RubyLenguajes interpretados de propósito generalBuenos frameworks y librerías para WebRuby: Ruby on RailsPython: Django...

Javascript lado servidor

Librería Node.js Incluye V8, el motor Javascript de GooglePermite utilizar Javascript en el servidorEntrada/Salida basada en eventosCreciendo en popularidad

Lenguajes generales compilados

2 ecosistemasJava (JVM) .Net (CLR)

JVM

Máquina virtual de JavaEmpotrado: JSPServlets y Contenedores de aplicaciones

TOMCATOtros lenguajes sobre JVM

Scala, Groovy, ...Programación políglota!

ASP.Net

Basado en CLR Máquina virtual de C#

ASP Permite empotrar lenguaje en HTMLExtensión aspx <% .... código %>

Diversos frameworks: ASP.Net MVXOtras lenguajes:

VB.Net, F#,...

Web Frameworks

Micro-frameworksBasados en protocol HTTPEnrutan verbos HTTP (GET, PUT, POST, DELETE) con acciones

MVC basedAbstracción del modelo de la WebSeparación: Modelo, Vista, ControladorPueden utilizar ORMs

Micro-frameworks

PHP: Slim, SilexRuby: SinatraPython: FlaskJava: Spark, Scala: Scalatra

Frameworks Web

Numerosos frameworksPHP: CakePHP, Zend, SymfonyRuby: Ruby on RailsPython: Django, ZopeJava: Spring MVC, PlayScala: Play, LiftGroovy: GrailsHaskell: Yesod

Más información:http://en.wikipedia.org/wiki/Comparison_of_web_application_frameworks

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

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

Arquitectura de la Web y Computación en el Servidor

Education

Transcript of Arquitectura de la Web y Computación en el Servidor