Tecnología web DYA DYA DYA. Qué es la Web? El cliente Web. Joan Vila. Diseño Y Aplicaciones de Sistemas Distribuidos

Transcripción

1 Tecnología web Tecnología web Joan Vila DISCA / UPV Departament d Informàtica de Sistemes i Computadors Universitat Politècnica de València Indice Introducción El protocolo HTTP Estructura de las aplicaciones web Aplicaciones web: la parte cliente Lenguajes de marcado: XML y HTML Webs interactivas: formularios Un ejemplo: la eurocalculadora (el cliente) Aplicaciones web: la parte servidora La interfaz CGI Información de estado: sesiones y cookies Un ejemplo: la eurocalculadora (el servidor) Diseño de aplicaciones web en Java El cliente: Applets El servidor: Servlets Servicios web 2 Qué es la Web? El cliente Web N browser hipervínculo Se usa HTTP en esta conexión TCP server xyz.com 80 server Internet hipervínculo server ab.com 80 server Navegadores Web Son, básicamente, visores gráficos de información con formato, provinente de la red. Una cuestión básica de diseño (o estrategia) es si están integrados en el propio sistema operativo como una extensión del navegador del sistema de ficheros. Tienen capacidad para trabajar unos protocolos y formatos básicos y extensiones (plugins) para ampliar su funcionalidad. El protocolo básico para obtener la información es: HTTP y HTTPS Manejan también otros protocolos como FTP, SMTP, Gopher, telnet, rm El formato básico de la información que manejan es: En la generación actual todos manejan HTML / GIF / JPEG Existe una nueva generación cuyo formato básico es XML Tienen extensiones para manejar muchos otros formatos de ficheros: MPEG-1, PDF, PostScript,... Tienen capacidad de procesamiento, pues la mayoría incluyen soporte para ejecutar lenguajes de programación: Scripts: JavaScript de Netscape, VBS (Visual Basic Script) de Microsoft Applets de Java. 3 4

2 El servidor Web Protocolo HTTP Servidores Web Son, básicamente, servidores de ficheros que atienden sus peticiones a través de la red (port 80). El protocolo básico es HTTP. Algunos antiguos están basados en FTP, ya que este proporciona casi la misma funcionalidad. Pueden tener extensiones para ejecutar programas externos, denominados programas CGI (Common Gate Interface): Lenguajes de programación de CGI s: PHP, shell, Perl, C,... Servlets: son CGI s hechos en Java (clase JSDK) C: telnet 80 T: Trying T: Connected to T: Escape character is ^[. C: GET /hypertext//theproject.html HTTP/1.0 C: S: HTTP/ Document follows S: MIME-Version: 1.0 S: Server CERN/3.0 S: Content-Type: text/html S: Content-Length:8247 S: Establecer conexión TCP Cabecera MIME RFC 822 S: <HEAD> <TITLE> The consortium </TITLE> </HEAD> S:<BODY> S:<H1> <IMG ALIGN=MIDDLE ALT= W3C SRC= w3c_96x67.gif > S: The World Wide Web Consortium </H1> <P> S: S: The world Wibe Web is the universe of information Petición HTTP Cuerpo o entidad Respuesta HTTP 5 6 Protocolo HTTP Protocolo HTTP HTTP: HyperText Transfer Protocol Definido en RFC1945, RFC La interacción suele realizarse sobre una conexión TCP (aunque no es estrictamente requerido) Cada elemento de una página web suele emplear una conexión TCP/IP Identificadores de recursos (URL, URI) http_url = " "//" host [ ":" port ] [ abs_path [ "?" query ]] Mensajes: Tipos: de petición y de respuesta HTTP-message: Request Response 7 HTTP: HyperText Transfer Protocol Estructura: generic-message = start-line *(message-header CRLF) CRLF [ message-body ] start-line = Request-Line Status-Line message-header = field-name ":" [ field-value ] message-body = entity-body <entity-body encoded as per Transfer-Encoding> Ejemplos: Request-Line: GET /hypertext//theproject.html Request-Line: GET /hypertext//theproject.html HTTP/1.0 Content-Type: Image/GIF <línea blanco> Status-Line: HTTP/ Document follows 200 OK, 304 errores 8

3 Protocolo HTTP Protocolo HTTP HTTP: HyperText Transfer Protocol GET HEAD PUT POST DELETE TRACE CONNECT Pedir al server devolver un mensaje (cabecera MIME +info) Request-URI: identifica la entidad a devolver If-Modified-Since: solicitud condicional. Si no se cumple la condición se utiliza pag. en cache Pedir al server devolver la cabecera de un mensaje. Pedir al server almacenar una info. en un recurso existente Request-URI: identifica un proceso que acepta datos. Validación de identificación y de permisos Pedir al server añadir o modificar una información. Request-URI: identifica la entidad a almacenar. Pedir al server eliminar una información. Validación de identificación y de permisos Pedir al nivel de aplicación devolver el mensaje original Uso de un proxy como un tunel 9 HTTP/1.1: campos de la cabecera Son metainformación (información no contenida en el objeto) Son todos opcionales. Normalmente son campos MIME (RFC 822), pero puede haber campos no MIME Allowed (GET, POST; PUT) Public Content-Length Content-Type Content-Transfer-Encoding Content-Encoding Date Expires Last-Modified Message-Id Message-Id URI: identificación del objeto vary=content-type, language, version Version Derived-From Content-Language Cost Link Title 10 Tecnología web Estructura de las aplicaciones web Indice Introducción El protocolo HTTP Estructura de las aplicaciones web Páginas web simples Cliente Servidor Aplicaciones web: la parte cliente Lenguajes de marcado: XML y HTML Webs interactivas: formularios Un ejemplo: la eurocalculadora (el cliente) Aplicaciones web: la parte servidora La interfaz CGI Información de estado: sesiones y cookies Un ejemplo: la eurocalculadora (el servidor) Diseño de aplicaciones web en Java El cliente: Applets El servidor: Servlets Servicios web server Páginas web 11 12

4 Estructura de las aplicaciones web Estructura de las aplicaciones web Aplicaciones web con procesamiento en el cliente: Applets Aplicaciones web con procesamiento en cliente y servidor Cliente Servidor Cliente Servidor Programa cliente Afwpfjpwerjf powertwerq Wqeoweohrowqe woqrejwerjp server Programa cliente Páginas web Programa cliente Nivel cliente Páginas web server Nivel web Programa servidor (cgi) Servicio Nivel aplicación Base de Datos Nivel almacenamiento Ejemplo: un video-juego Máquina web Máquina base de datos Estructura de las aplicaciones web Estructura de las aplicaciones web Servicios web Computación distribuida con servicios web Aplicaciones web distribuidas Son aplicaciones cliente-servidor donde el cliente se ejecuta en un navegador web y en las que cliente y servidor comunican a través del servidor de web. Nivel cliente HTTP GET, PUT Páginas web server Invocaciones métodos Invocaciones métodos Servicio Base de Datos Como en toda aplicación distribuida hay que balancear la carga entre el cliente y el servidor. Se intenta realizar en la parte del cliente el máximo procesamiento posible ( los ciclos del servidor son de oro ). Algunos aspectos claves de diseño son: Comunicación segura Mantenimiento de la información de estado de una conexión. Almacenamiento de información persistente. server Nivel web Servicio Nivel aplicación Base de Datos Nivel almacenamiento 15 16

5 Estructura de las aplicaciones web Tecnología web Nivel Cliente La funcionalidad del cliente se centra en la interacción con el usuario, lo cual incluye: Visualización de la información formateada (en lenguajes de formato) Procesamiento de formularios Procesamiento gráfico y multimedia Nivel Servidor El servidor, fundamentalmente, realiza procesamiento propio de la semántica de la aplicación: Intercambiar información con el cliente a través del servidor web Mantenimiento de información de estado con los diferentes clientes Nivel Almacenamiento Proporciona acceso a bases de datos a través de interfaces estándares (ODBC). Indice Introducción El protocolo HTTP Estructura de las aplicaciones web Aplicaciones web: la parte cliente Lenguajes de marcado: XML y HTML Webs interactivas: formularios Un ejemplo: la eurocalculadora (el cliente) Aplicaciones web: la parte servidora La interfaz CGI Información de estado: sesiones y cookies Un ejemplo: la eurocalculadora (el servidor) Diseño de aplicaciones web en Java El cliente: Applets El servidor: Servlets Servicios web Lenguajes de intercambio de información Lenguajes de intercambio de información Lenguajes de marcado Lenguajes de marcado El objetivo de los lenguajes de marcado es proporcionar a la información una estructura y un formato (metainformación). La forma en que logran esto es acompañando la información mediante una serie de etiquetas (marcas). <ol> <li> Letra normal <li> <b> Letra negrita </b> <li> <i> Letra itálica </i> </ol> 1. Letra normal 1. Letra normal 2. Letra negrita 2. Letra negrita 3. Letra itálica 3. Letra itálica Objetivos: Ser lo suficientemente genéricos para describir cualquier tipo de documento. Ofrecer un formato de datos universal que permita adaptar o transformar fácilmente la información (basándose en etiquetar la información con una descripción). Ejemplos: Lenguajes de marcado generales SGML (Standard Generalized Markup Language). ISO 8879 SGML XML (extensible Markup Languaje). W3C standard Lenguajes de marcado para dominios de aplicación específicos HTML: derivado de SGML para realización de páginas web. Etc

6 XML XML XML: Un ejemplo <?xml version="1.0" encoding="iso "?> -  - <CATALOG> - <CD> <TITLE>Empire Burlesque</TITLE> <ARTIST>Bob Dylan</ARTIST> <COUNTRY>USA</COUNTRY> <COMPANY>Columbia</COMPANY> <PRICE>10.90</PRICE> <YEAR>1985</YEAR> </CD> <CD> <TITLE>Hide your heart</title> <ARTIST>Bonnie Tyler</ARTIST> <COUNTRY>UK</COUNTRY> <COMPANY>CBS Records</COMPANY> <PRICE>9.90</PRICE> <YEAR>1988</YEAR> </CD> </CATALOG> 21 XML: extensible Markup Language Formato universal para intercambio de información. Sirve para que los programas comuniquen datos e interpreten adecuadamente los tipos de dato. Permite especificar información con estructura Estructura jerárquica Su sintaxis es sencilla. Se marca TODO: <componente> texto del componente </componente> Muy flexible: las marcas no son fijas, sino dependientes de la aplicación. El formato con que debe verse la información en un determinado medio se especifica mediante hojas de estilo: CSS (Cascading Style Sheets): parcialmente implementado en navegadores web. XSL (extended Style Shhet Language): definido por W3C. 22 HTML HTML: etiquetas básicasb HTML: Hypertext Markup Language Derivado de SGML (subset). Un ejemplo: <html> <head>  --> <title> Ejemplo1 </title> </head> <body background=pared.gif text=#0000ff> Este Este es es el el ejemplo 1 de de pagina web. web. La La letra letra es es de de color color azul. azul. </body> </html> 23 Etiquetas para formatear la página Etiqueta Atributos de la etiqueta body Descripción <html>... </html> Declara que la página web está escrita en HTML <head>... </head> Delimita la cabecera de la página <title>... </title> Delimita el título (no se presenta en la página) <body>... </body> Delimita el cuerpo de la página <body background=pared.gif text=#0000ff> Propiedades del fondo: background, bgcolor, bgsound, bgproperties Márgenes: leftmargin, topmargin Colores del texto: text, link, vlink, alink 24

7 HTML HTML: formularios HTML: Hypertext Markup Language HTML posee etiquetas para proporcionar las siguientes características: Formatear la página Formatear de texto Realizar listas Realizar tablas Incluir gráficos (GIF y JPEG) Realizar marcos en el visor web Realizar hipervínculos Formularios Formularios HTML Permiten realizar página web interactivas en las que el cliente proporciona información a un programa servidor a través del servidor web. 26 HTML: formularios HTML: formularios Tipos de formularios Etiquetas y atributos para formularios 27 Etiquetas <form>...</form> <input> <textarea>... </textarea> <select>... </select> <option>... </option> Atributos de form <form name="..."> <form method="..."> <form action="..."> Los métodos GET Y POST GET: los valores se agregan al URL separados por?. POST: el cuerpo del mensaje HTTP contiene las variables: pts= Descripción Delimita la definición de un formulario Define un formulario de enrtrada Define una área de texto Define un selector Define un menu de items Descripción Define una etiqueta para el formulario Define un método para el formulario GET/POST Define la ubicación de una acción para el formulario 28

8 HTML: formularios Un ejemplo: la eurocalculadora (el cliente) Etiquetas y atributos para formularios La eurocalculadora Atributos de input Descripción <input type="..."> Define el tipo de entrada: text, radio, checkbox, etc. <input name="..."> Define una etiqueta para la entrada <input value="..."> Define el concepto de la entrada <input onclick="..."> Define lo que pasa cuando se valida la entrada (Javascript) <input onsubmit="..."> Define lo que pasa cuando se aprieta el boton de enviar (Javascript) <input size="..."> Define el tamaño requerido por la entrada <input maxlength="..."> Define el máximo tamaño de la entrada Atributos de textarea <textarea rows="..."> Descripción Define el número de filas del área de texto Atributos de select <select name="..."> Descripción Define una etiqueta para el selector Un ejemplo: la eurocalculadora Un ejemplo: la eurocalculadora (el cliente) Programación a nivel del cliente La página web en HTML Se realizará en JavaScript Realizar comprobaciones sintácticas Ejemplo: si el campo del formulario queda vacío, no envía la petición al servidor para su procesamiento. Realizar la conversión de pts. a euros Esto puede realizarse perfectamente a nivel de cliente, sin recurrir al servidor. Programación a nivel del servidor Se realizará en PHP3 (Realizar la conversión de pts. a euros) Llevar un contador con el número de visitantes. Realizar un fichero de registro con las IP s de los diferentes clientes que acceden el servicio. <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <title>eurocalculadora</title> <style>  </style> <script>  </script> </head> 31 32

9 Un ejemplo: la eurocalculadora (el cliente) Un ejemplo: la eurocalculadora (el cliente) El formulario HTML <body bgcolor="#f6f2e3" face="charter" link="#4232d9"> <h1>eurocalculadora</h1> Fique el valor que desitja convertir: <br> de S er v ic web io uladora e ur o c a lc <form name="ec" action=" method="post onclick= "return verifica();"> Llamadas a JavaScript onsubmit="return calcula();"> <h3> Quantitat: <input type="text" name="quant" size="20"> </h3> Tipus de conversió: <select name="conv" size="1" align="left" > <option selected="selected" value="0">---> Per favor, trie el tipus de conversió <---</option> <option value="1"> Pts --> Euros </option> <option value="2"> Euros --> Pts </option> Campos del formulario </select> <input type="submit" name="action" value="convertir" > </form> Botón y d e </body> fin form d el envio </html> u lario 33 Procesamiento en el lado del cliente Realizado en JavaScript <script>  </script> 34 Un ejemplo: la eurocalculadora (el cliente) Tecnología web Procesamiento en el lado del cliente Realizado en JavaScript <script>  </script> Indice Introducción El protocolo HTTP Estructura de las aplicaciones web Aplicaciones web: la parte cliente Lenguajes de marcado: XML y HTML Webs interactivas: formularios Un ejemplo: la eurocalculadora (el cliente) Aplicaciones web: la parte servidora La interfaz CGI Información de estado: sesiones y cookies Un ejemplo: la eurocalculadora (el servidor) Diseño de aplicaciones web en Java El cliente: Applets El servidor: Servlets Servicios web 35 36

10 La interfaz CGI La interfaz CGI CGI: Common Gateway Interface La interfaz CGI define una metodología para que el servidor Web acomode programas y servicios adicionales que se utilizan para acceder y ejecutar aplicaciones externas (programas CGI) a los servidores. Su finalidad es procesar información solicitada por los clientes (formularios) y devolverles una respuesta. Aplicaciones: Procesado de formularios Conexión a bases de datos Las extensiones al servidor Web se proporcionan en forma de paquetes: Paquete CERN Paquete NCSA httpd Nombre DNI N Cliente Servidor E/S estándar Variables redirigidas CGI al servidor web xaloc.upv.es /cgi-bin/ uncgi.exe CGI Base de datos Fichero etc.. URL: La interfaz CGI La interfaz CGI Interacción Servidor Web/programa CGI Datos de entrada al CGI: el proceso CGI toma datos del cliente a partir de variables CGI. En un entorno UNIX el servidor web pasa estas variables al programa CGI como variables de entorno del shell. Datos de salida del CGI: El programa CGI envia su salida al servidor web que, a su vez, la reenvía al cliente web. En un entorno UNIX el CGI pasa estas variables al servidor web mediante una tubería, redirigiendo su salida estándar. Variables CGI Uso de variables CGI: se utilizan para pasar los datos relacionados con las peticiones HTTP del servidor a la aplicación CGI correspondiente. Tipos de variables: Variables de entorno: las establece el servidor web a partir de los datos de la conexión y la cabecera de las peticiones. Permiten averiguar datos relativos a la propia petición (tipo, longitud,...), al cliente (IP, Navegador,...) o al propio servidor (nombre, puerto, software) Variables definidas por el cliente. Existen dos métodos para pasar estas variables: GET POST Acceso a las variables CGI: En sistemas UNIX son variables de entorno del shell. En general los lenguajes de programación para aplicaciones Web proporcionan bibliotecas. Mas info:

11 La interfaz CGI La interfaz CGI Variables de entorno CGI AUTH_TYPE: Protocolo seguido para verificación de acceso. HTTP proporciona un sencillo mecanismo: AUTH_TYPE = Basic pide ID y contraseña CONTENT_LENGTH: Tamaño ( en hexadecimal) de octetos de entidad vinculada CONTENT_TYPE: MIME de entidad vinculada TIPOS SUBTIPOS application octet-stream (datos de la aplicación) text plain message rfc822, partial, external-body image gif, jpeg audio basic video mpeg multipart mixed/alternative, digest, parallel GATEWAY_INTERFACE: versión de CGI del servidor HTTP_(cadena): cabecera de los datos del cliente 41 Variables de entorno CGI PATH_INFO: ruta de la aplicación CGI PATH_TRANSLATED: ruta relativa la sistema operativo de la aplicación CGI QUERY_STRING: Valor de las variables a pasar a un CGI. Sigue al caracter? En un URL http// REMOTE_ADDR: dirección IP del cliente que hace la petición. REMOTE_HOST: nombre del dominio del cliente que hace la petición. REMOTE_IDENT: identidad del usuario utilizado en el servidor. REMOTE_USER: si se usa identif. nombre del usuario autentif. por el servidor REQUEST_METHOD: GET, HEAD, POST; PUT, DELETE, TRACE, CONNECT SCRIPT_NAME: URL de una aplicación CGI SERVER_NAME: nombre de dominio o dirección IP del servidor tal como aparece en el URL SERVER_PORT: http// SERVER_PROTOCOL = HTTP/1.1, SERVER_SOFTWARE= NCSA/ La interfaz CGI La interfaz CGI Lenguajes para programación de CGIs Acceso a variables CGI desde lenguajes de programación Ejemplos: Perl, PHP, ASP, Python, Java, etc... Ejemplo en PHP5 Características: Manejo de conexiones Acceso a variables CGI Mantenimiento de información de estado (sesiones, cookies...) Conexiones a bases de datos Seguridad Envío de archivos $_POST[ var ] es un array de variables predefinida por la que se puede acceder a las variables enviadas por un formulario con el método POST. $REMOTE_ADDR es una variables predefinida de entorno por la que se puede obtener el IP del cliente Forma de obtener variables de formulario y cookies en PHP 5 function phpgetvar($var) { if(!isset($$var)) {$$var 0 $GET[ $var ]; if(!isset($$var)) {$$var 0 $POST[ $var ]; if(!isset($$var)) {$$var 0 $COOKIE[ $var ]; 43 44

12 Gestión n de la información n de estado Gestión n de la información n de estado Información de estado Sesiones En las webs interactivas, es decir, webs donde los clientes realizan algún tipo La información es mantenida en la parte del servidor. de transacción, el servidor necesita mantener información de estado de los Las sesiones se caracterizan por las siguientes operaciones: diferentes clientes con los que mantiene conexiones. Ejemplo: En las librerías web el servidor necesita implementar el concepto de carro de compra: para cada cliente se almacena en su carro de compra los libros que ha ido adquiriendo. Existen dos formas básicas de mantener la información de estado: Sesiones: la información es mantenida en la parte del servidor Cookies: el servidor envía la cliente la información de estado en una cookie. El cliente la devuelve al servidor al principio de cad interacción. Cookies Abrir una sesión (devuelve un identificador) Almacenar u obtener datos de una sesión Invalidar una sesión: manual o automáticamente Son objetos que el servidor web puede enviar en la cabecera de una petición HTTP al visor con información codificada. El navegador web: No puede modificar los cookies. Devuelve los cookies al servidor cada vez que realiza una petición al mismo. Aunque se interrumpa la sesión entre el cliente y el servidor o el servidor muera, se puede reanudar posteriormente la interacción, pues el cliente guarda en los cookies su información de estado Cookies Un ejemplo: la eurocalculadora (el servidor) 2 El navegador web devuelve los cookies al principio de cada interacción La eurocalculadora Nombre DNI N 1, 4,... Cliente El servidor www crea y envia los cookies al visor al principio de una interacción 3 Servidor El servidor pone variables en los cookies y los manipula Php3.exe Página dinámica 47 48

13 Un ejemplo: la eurocalculadora (el servidor) Un ejemplo: la eurocalculadora (el servidor) La eurocalculadora N Eurocalculadora Quantitat Cliente eurocal.html <html> <script> function verifica(){ </script> <form name="ec" action="eurocal.php3" onsubmit="return verifica();"> eurocal.html <html> <script> function verifica(){ </script> <form name="ec" action="eurocal.php3" onsubmit="return verifica();"> Servidor Php3.exe eurocal.php <?php> $pts = $HTTP_POST_VARS["pts"]; echo <html> ;... echo $pts/ echo </html> 49 Procesamiento en el lado del servidor (i) Realizado en PHP3 <?php // FUNCTION cabeza function cabeza($titulo){ echo "<HTML> <HEAD> <TITLE>"; echo $titulo; echo </TITLE> <style> <!-- P { text-align: justify H1 { color:#674c9b; font-family:'comic Sans MS',helvetica; font-size:18pt; H2 { color:#7700ff; font-family:'comic Sans MS',helvetica; font-size:16pt; H3 { color:#000000; font-family:'comic Sans MS',helvetica; font-size:14pt; </style> </HEAD> <body bgcolor=#f6f2e3 face=charter link=#4232d9> <div style='padding-left:20 ; padding-right:20'> <br><br> "; 50 Un ejemplo: la eurocalculadora (el servidor) Un ejemplo: la eurocalculadora (el servidor) Procesamiento en el lado del servidor (ii) <?php... // FUNCTION cola function cola() { echo </div> </body> </html> " // FUNCTION escribe IP function escribeip() { $fitxer = "$DOCUMENT_ROOT\\ip.txt"; $fd = fopen($fitxer, a"); fwrite( $fd, $REMOTE_ADDR); fclose( $fd ); 51 Procesamiento en el lado del servidor (iii)... // MAIN cabeza("eurocalculadora"); echo "<h1> Eurocalculadora </h1>"; $pts = 0; $qorg = $_POST[ quant"]; $conv = $_HTTP_POST["conv"]; switch ($conv) { case 1: $org = "pts."; $dst = "euros"; $qdst = $quant /167; break; case 2: $org = "euros"; $dst = "pts."; $qdst = $quant * 167; break; 52

14 Un ejemplo: la eurocalculadora (el servidor) CGI s Procesamiento en el lado del servidor (iv) Ejemplo de CGI en Python <?php... // MAIN echo "<h3>"; echo "$qorg $org equivalen a <font color=\"ff0000\"> $qdst </font> $dst"; echo "</h3>"; escribeip(); cola();?> 53 #! F:\programa\python\python.exe # Imports # ======= import sys import cgi print "Content-type: text/html" print print "<h1> Los campos del formulario son: </h1>" form=cgi.fieldstorage() f=open('resultados.txt', 'a') for x in form.keys(): y= '('+ x + ':' + form[x].value + ')' print '<h2>', y, '</h2>' f.write(y) f.write('\n') 54 Tecnología web Applets Indice Introducción El protocolo HTTP Estructura de las aplicaciones web xaloc.es Aplicaciones web: la parte cliente Lenguajes de marcado: XML y HTML Webs interactivas: formularios Un ejemplo: la eurocalculadora (el cliente) Aplicaciones web: la parte servidora La interfaz CGI Información de estado: sesiones y cookies Un ejemplo: la eurocalculadora (el servidor) Diseño de aplicaciones web en Java El cliente: Applets El servidor: Servlets Servicios web Cliente N echoclient. class Máquina virtual java referencia migran echo. html Servidor Servidor echo echoclient. class 55 56

15 Applets Servlets Applets Servlets Son subclases de la clase Applet Son objetos gráficos (subclases de Component) que se pueden ejecutar en el entorno de un browser de red (siempre que este incluya la máquina virtual). El sistema gráfico AWT es representable por el browser de red. Se lanzan desde un fichero en HTML: ésto hace migrar el código del URL remoto al browser de red. Tienen algunas limitaciones de seguridad en el acceso a ficheros y recursos de la máquina a la que migran. Son una forma de realizar CGI s en Java (server side programming) Tiene capacidades para manipular peticiones y respuesta a formularios HTML No tienen una interfaz gráfica (a diferencia de los Applets) Servlets Arquitectura del paquete javax.servlet Las interfaces Servlet y HttpServlet proporcionan métodos para gestionar el Applet y manejar las comunicaciones con los clientes. Cuando un servlet acepta una petición de un cliente recibe dos objetos ServletRequest: encapsula la comunicación del cliente al servlet ServletResponse: encapsula la comunicación del servlet al cliente Servicios web en SOAP Joan Vila DISCA / UPV Departament d Informàtica de Sistemes i Computadors Universitat Politècnica de València 59

16 Servicios web Servicios web Indice Conceptos básicos SOAP Estructura de SOAP SOAP y WSDL SOAP UDDI Soporte SOAP para Java Interfaz dinámico de invocaciones Interfaz estático de invocaciones (Axis) Soporte SOAP para PHP Un ejemplo en SOAP La eurocalculadora en SOAP / Java XML-RPC Qué es un servicio web? Es un servicio en Internet accesible con protocolos de RPC implementados sobre HTTP. Basado en invocaciones RPC (invocación-respuesta) semejantes a las invocaciones a procedimientos u objetos remotos. Permite utilizar el paradigma de objetos distribuidos en Internet Ejemplos: Servicio de fax, servicio de SMS, motor de búsqueda de información (Google), servicio de información bursátil, servicio de traducción de texto, etc... Catálogo: Base para computación distribuida con HTTP Interfaz programática: invocable desde programas; no solo desde páginas web. Permite que un servidor (programa CGI) pueda convertirse en cliente de otros servicios Servicios web Servicios web Computación distribuida con servicios web Protocolos Transferencia de datos y protocolos basados en XML Nivel cliente HTTP GET, PUT Páginas web server server Invocaciones métodos Invocaciones métodos Servicio Servicio Base de Datos Base de Datos XML-RPC: es la base. Llamadas remotas codificadas en XML que son menos eficientes que en binario pero mucho más estándares y estructuradas. SOAP: extiende mejora XML-RPC. Lo que mucha gente entiende como web services. Uso extensivo de espacios de nombres y etiquetas de marcado. Esponsorizada por Microsoft como estándar y apoyada por IBM. Base de la campaña.net. XML-RPC vs SOAP: Nivel web Nivel aplicación Nivel almacenamiento 63 64

17 Servicios web SOAP Indice Conceptos básicos SOAP Es un estándar basado en XML para la mayoría de servicios web públicos SOAP Usa un lenguaje de definición de servicios (análogo a IDL), donde se definen los Estructura de SOAP SOAP y WSDL SOAP UDDI Soporte SOAP para Java Interfaz dinámico de invocaciones Interfaz estático de invocaciones (Axis) Soporte SOAP para PHP Un ejemplo en SOAP La eurocalculadora en SOAP / Java servicios a publicar, los tipos de datos a enviar y retornar. El WSDL es como la URL en XML-RPC. WSDL: Web Services Definition Language Existe un directorio de servicios web para descubrir de forma dinámica nuevos servicios: UDDI: Universal Description Directory Integration XML-RPC SOAP SOAP Estructura de un mensaje SOAP Ejemplo simple El envoltorio no contiene datos de aplicación, solo empaqueta el contenido. La cabecera opcional puede contener información de control El cuerpo contiene los datos en XML Los datos adjuntos (attachments) pueden contener otros tipos de datos (binarios, uuencoded, etc.) Envoltorio SOAP más externo Cabecera SOAP Información adicional: enrutado, autorización, etc. Cuerpo SOAP Datos de aplicación Invocación respuesta RPC errores Servicio de seguimiento de vuelos web Llamada con código de portador y número de vuelo: public Date getflightarrival(string carrier, int number) Retorna hora estimada de llegada: Arrival for AS 25 is Sat Jun 15 00:32:19 PDT

18 SOAP Formato de la petición SOAP <SOAP-ENV:Envelope SOAP-ENV:encodingStyle= SOAP Formato de la respuesta SOAP <SOAP-ENV:Envelope XML Schema: Structures specifies the XML Schema definition language, which offers facilities for describing the structure and constraining the contents of XML 1.0 documents, including those which exploit the XML Namespace facility. " xmlns:soap-env=" xmlns:xsd=" xmlns:xsi=" xmlns:soap-enc=" <SOAP-ENV:Body> <getflightarrival> <op1 xsi:type="xsd:string">as</op1> <op2 xsi:type="xsd:int">25</op2> xmlns:soap-env=" xmlns:xsd=" xmlns:xsi=" <SOAP-ENV:Body> <getflightarrivalresponse SOAP-ENV:encodingStyle= " <getflightarrivalresult xsi:type="xsd:datetime"> t07:32:19.403z </getflightarrivalresult> </getflightarrivalresponse> </getflightarrival> </SOAP-ENV:Body> </SOAP-ENV:Envelope> </SOAP-ENV:Body> </SOAP-ENV:Envelope> WSDL WSDL Anatomía de un documento WSDL Si se examina cada parte de un documento WSDL se encontrará: <definitions>. El elemento <definitions> contiene la definición de uno o más servicios. En la mayoría de los casos, un archivo WSDL define un servicio únicamente. Seguido de la etiqueta de definición se encontrarán declaraciones de algunos atributos: <message> y <porttype>, describe qué operaciones provee el servicio. <binding>, describe cómo se invocan las operaciones. <service>, describe dónde se ubica el servicio. <documentation>, cualquier elemento WSDL puede contener información del servicio para el usuario. Generando la descripción de servicio WSDL La mayoría de las herramientas incluyen una forma de generar WSDL a partir de un componente. incluyendo el Apache Jakarta Axis, WSTK de IBM y el.net Studio de Microsoft. Ejemplo de WSDL (i) <?xml version="1.0" encoding="utf-8"?> <definitions name="flightservice" targetnamespace=" <message name="getflightarrival"> <part name="string_1" type="xsd:string"/> <part name="int_2" type="xsd:int"/> </message> <message name="getflightarrivalresponse"> <part name="result" type="xsd:datetime"/> </message> <porttype name="flightremote"> <operation name="getflightarrival"> <input message="tns:getflightarrival"/> <output message="tns:getflightarrivalresponse"/> </operation> </porttype> (continued...) 71 72

19 WSDL SOAP- UDDI Ejemplo de WSDL (ii) <binding name="flightremotebinding" type="tns:flightremote"> <operation name="getflightarrival"> <input><soap:body encodingstyle=" use="encoded" namespace=" </input> <output><soap:body encodingstyle=" use="encoded" namespace=" </output> <soap:binding transport= style="rpc"/> </binding> <service name="flight"> <port name="flightremoteport" binding="tns:flightremotebinding"> Servicio de directorio UDDI UDDI (Universal Description Directory Integration) Servicio de directorios estandarizado Automaticamente registra y busca los servicios 7000 empresas registradas? Funcionalidad Registra y retorna descripciones WSDL en formato XML Hay algunas críticas que dicen que no hay forma automatizada de que los programas usen la información y que se requiere intervención humana para escribir el código... Llenará WSIF el hueco??? WSDL UDDI Registry WSDL <soap:address location=" </port> </service> </definitions> 73 Client SOAP Web service 74 Servicios web Soporte SOAP para Java Indice Conceptos básicos SOAP Soporte SOAP para Java JAX: Java API for XML-based RPC Core technology for J2EE 1.4 Estructura de SOAP SOAP y WSDL SOAP UDDI Soporte SOAP para Java Interfaz dinámico de invocaciones Interfaz estático de invocaciones (Axis) Soporte SOAP para PHP Un ejemplo en SOAP La eurocalculadora en SOAP / Java XML-RPC JSR-109 define los descriptores para desarrollo de servicios web Con EJB 2.1 soporta directamente servicios web tipo beans con sesiones sin estado Funcionalidad JAX-RPC mapea SOAP/WSDL a RMI: Porting de WSDL a interfaces Remote de RMI (interface extending java.rmi.remote) Invocaciones WSDL mapeadas a invocaciones RMI Los métodos propagan la excepción java.rmi.remoteexception (Los fallos SOAP se convierten a RemoteExceptions) Soporta un subconjunto de RMI Solo soporta algunos tipos básicos - primitives and wrappers, bean-likes, String, Date, BigInteger, BigDecimal, etc. Others will use JAXB or pluggable serializers 75 76

20 Soporte SOAP para Java Soporte SOAP para Java Tipos de invocaciones SOAP Soporte SOAP para Java: Dynamic Invocation Interface (DII) Estática: Funciona sin stubs estáticos: configura la información del servicio al vuelo : Precisa la generación de stubs derivados de la definición del servicio en WSDL Invocación del estilo: referenciaobjeto->nombremetodo(argumentos) Dinámica: No precisa generación de stubs Invocación del estilo: Call call = (Call) service.createcall(); // Construir invocación call.invoke(...); Un servicio javax.xml.rpc.service se crea instanciando la clase: javx.xml.rpc.servicefactory Una llamada se crea y se configura (endpoint, operation, parameters, return type, etc.) con la clase javax.xml.rpc. La llamada se ejecuta con: call.invoke( ) Adecuado para servicios simples Soporte SOAP para Java Soporte SOAP para Java Soporte SOAP para Java: Dynamic Invocation Interface (DII) Soporte SOAP para Java: montaje estático import org.apache.axis.client.call; import org.apache.axis.client.service; import javax.xml.namespace.qname; public class TestClient { public static void main(string [] args) { try { String endpoint = " Service service = new Service(); Call call = (Call) service.createcall(); call.settargetendpointaddress( new java.net.url(endpoint) ); call.setoperationname(new QName(" "echostring")); String ret = (String) call.invoke( new Object[] { "Hello!" ); Invocación de métodos con estilo RPC estático: referenciaobjeto->nombremetodo(argumentos) Proyecto Axis Successor to Apache SOAP (itself originally based on IBM SOAP4J) Basado en la generación automática de stubs a partir de WSDL Java2WSDL: para generar WSDL y stubs a partir de las clases Java que implementan el servicio WSDL2Java: para generar clases Java a partir de WSDL Más fácil de usar que JAX-RPC Y compatible con JAX-RPC System.out.println("Sent 'Hello!', got '" + ret + "'"); catch (Exception e) { System.err.println(e.toString()); 79 80

21 Soporte SOAP para Java Servicios web Soporte SOAP para Java: montaje estático Indice Estructura Conceptos básicos SOAP Código de aplicación Stubs SOAP SOAP runtime HTTP RPC s Generados por Axis Mensajes XML Código de aplicación Stubs SOAP SOAP runtime HTTP Estructura de SOAP SOAP y WSDL SOAP UDDI Soporte SOAP para Java Interfaz dinámico de invocaciones Interfaz estático de invocaciones (Axis) Soporte SOAP para PHP Un ejemplo en SOAP La eurocalculadora en SOAP / Java XML-RPC Soporte SOAP para PHP Servicios web Soporte SOAP para PHP Indice Incluido a partir de PHP5 Conceptos básicos Obtención de referencias a servidores $client = new SoapClient(" Invocación remota estática $qdst = $client->convertiraeuros( $_POST[ euros"], $_POST[ codi"]); Creación de un servidor $server = new SoapServer("eurocalc.wsdl"); $server->setclass("serveieurocalculadora"); SOAP Estructura de SOAP SOAP y WSDL SOAP UDDI Soporte SOAP para Java Interfaz dinámico de invocaciones Interfaz estático de invocaciones (Axis) Soporte SOAP para PHP Un ejemplo en SOAP La eurocalculadora en SOAP / Java XML-RPC 83 84

22 La Eurocalculadora en SOAP La Eurocalculadora en SOAP El formulario HTML Estructura de la aplicación Cliente Servidor 1 Servidor 2 85 eurocalc.html euroclient.php HTML Formulario PHP Invocación SOAP eurocalc.wsdl EuroCalc.java interfaz WSDL JAVA o PHP Stubs SOAP ConvertirAEuros multiplicar x coef ConvertirEuros dividir / coef GetExchangeRates.wsdl interfaz WSDL getexchangerates getcurrencycodes convert Proporciona cambios oficiales entre monedas 86 La Eurocalculadora en SOAP La Eurocalculadora en SOAP El cliente 1 <?php al Servidor... referencia cabeza("eurocalculadora"); Obtener echo "<h1> Eurocalculadora </h1>"; $client = new SoapClient(" switch ( $_POST["conv"] ) { case 1: SOAP... Invocación $qdst = $client->convertiraeuros( $_POST[ euros"], $_POST[ codi"]);... break; case 2: SOAP... Invocación $qdst = $client->convertireuros( $_POST[ moneda"], $_POST[ codi"], );... break;...?> El servidor1 en PHP (i) <?php class ServeiEuroCalculadora { 2 al Servidor function ConvertirEuros($euros, $codi) { referencia $codeclient=new SoapClient( Obtener " ); $rate=$codeclient->getexchangerate("eur",$codi); Invocación SOAP return $euros*$rate; 2 al Servidor function ConvertirAEuros($moneda,$codi) { referencia $codeclient=new SoapClient( Obtener " $rate=$codeclient->getexchangerate($codi,"eur"); Invocación SOAP return $moneda*$rate; 87 88

23 La Eurocalculadora en SOAP La Eurocalculadora en SOAP El servidor1 en PHP (ii) El servidor2 en Java (i) <?php import uk.co.dsdata.ws.finance.forex.exchangeservice.*;... $server = new SoapServer("eurocalc.wsdl"); $server->setclass("serveieurocalculadora"); if ( $_SERVER["REQUEST_METHOD"] == "POST") { $server->handle(); else { echo "This SOAP server can handle following functions: "; $functions = $server->getfunctions(); foreach($functions as $func) { echo $func. "\n";?> Crear Servidor public class EuroCalc { private GetExchangeRatesService exchangeratesservice; private GetExchangeRates exchangerates; public float ConvertirEuros(float euros, String codi) throws java.rmi.remoteexception { double rate = exchangerates.getexchangerate("eur", codi); return (float) (euros * rate); public float ConvertirAEuros(float moneda, String codi) throws java.rmi.remoteexception { double rate = exchangerates.getexchangerate(codi, "EUR"); return (float) (moneda * rate); La Eurocalculadora en SOAP Servicios web El servidor2 en Java (ii) Indice public class EuroCalc { Conceptos básicos... public boolean CodiValid(String codi) throws java.rmi.remoteexception { CurrencyData[] array = exchangerates.getcurrencycodes(); boolean existeix = false; for (int i = 0; i < array.length; i++) { if (array[i].getcode().matches(codi)) { existeix = true; break; return existeix; public EuroCalc() throws javax.xml.rpc.serviceexception { exchangeratesservice = new GetExchangeRatesServiceLocator(); exchangerates = exchangeratesservice.getgetexchangerates(); ; Constructor Inicializar referencia SOAP Estructura de SOAP SOAP y WSDL SOAP UDDI Soporte SOAP para Java Interfaz dinámico de invocaciones Interfaz estático de invocaciones (Axis) Soporte SOAP para PHP Un ejemplo en SOAP La eurocalculadora en SOAP / Java XML-RPC 91 92

24 La Eurocalculadora en XML-RPC La Eurocalculadora en XML-RPC La eurocalculadora como servicio web en XML-RPC Se va a adecuar el código de la eurocalculadora en PHP para poderla utilizar <?php... // Servicios Web como servicio web en XML-RPC XML-RPC como servidor se incorpora a PHP a través de una herramienta GPL XML-RPC Class Server Class Test { // Función de pruebas, que nos permite ver el código XML Intercambiado function Test($secret) { if ($secret!= 42 ) { trigger_error(secret does not match., E_USER_ERROR); function pts2euro($quant) { escribeip(); return $qorg /167; function euro2pts($quant) { escribeip(); return $qorg *167; XML-RPC XML-RPC Invocación de un servicio web en XML-RPC Para invocarlo habría que enviar, en principio, una solicitud XML y la respuesta es una página web cuyo código es XML. Invocación de un servicio web desde otros servicios Se trata de una RPC pues se pueden invocar rutinas PHP remotas desde un servidor escrito en PHP. Esta es la potencia de este esquema. La función Test permite ejecutar el Servicio Web, sin tener que enviar la solictud en XML sino simplemente, una solicitud GET corriente: Respuesta del servicio web <xml version= 1.0 encoding= iso ?> <methodresponse> <params> <param> <value><string>21,234</string></value> </param> </params> <methodresponse> En PHP <? include_once(./class.remotetest.php ); RemoteClassRegistry::addURL( DEFAULT_URL, ); $test = new Test(42); print $test->pts2euro( 3546 );?> - En Perl #!/vol/perl-5.6/bin/perl Use RPC::XML::Client; my $client = RPC::XML::Client->new( ); my $response = $client->send_request( Test.pts2euro, 3546 ); print $response->value, \n ; 95 96

25 XML-RPC Enlaces Petición XML de un servicio web Las anteriores invocaciones en PHP o Perl generarían automáticamente una petición XML del siguiente estilo: POST /ec UserAgent: SupaDupa XML-RPC Client/0.1 Host: unhost.upv.es Content-Type: text/xml Content-Legth: 201 <xml version= 1.0 encoding= iso ?> <methodcall> <methodname>test.pts2euro</methodname> <params> <param> <value><string>3546</string></value> </param> </params> <methodcall> Enlaces Web Services & Java home - Java Web Services tutorial - Apache Axis SOAP WSDL JAX-RPC home - Tutorials: XML namespaces XML namespaces [Definition:] An XML namespace is a collection of names, identified by a URI reference [RFC2396], which are used in XML documents as element types and attribute names. <termdef id="dt-dog" term="dog"> XML namespaces differ from the "namespaces" conventionally used in computing disciplines in that the XML version has internal structure and is not, mathematically speaking, a set. These issues are discussed in "A. The Internal Structure of XML Namespaces". An example namespace declaration, which associates the namespace prefix edi with the namespace name <x xmlns:edi='  </x> An example of a qualified name serving as an element type: <x xmlns:edi='  <edi:price units='euro'>32.18</edi:price> </x>