Tec Web

Diseo Y Aplicaciones de Sistemas Distribuidos
Tecnologa web
Integracin de aplicaciones distribuidas en la web
Joan Vila
DISCA / UPV Departament dInformtica de Sistemes i Computadors Universitat Politcnica de Valncia
Tecnologa web
Indice
Introduccin
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 Informacin de estado: sesiones y cookies Un ejemplo: la eurocalculadora (el servidor) El cliente: Applets El servidor: Servlets
2
Diseo de aplicaciones web en Java

DYA
Servicios web
Qu es la Web?
server xyz.com
hipervnculo
server ab.com
hipervnculo
WWW browser
80 WWW server
80 WWW server
Se usa HTTP en esta conexin TCP
DYA
Internet
El cliente Web
Navegadores Web
Son, bsicamente, visores grficos de informacin con formato, provinente de la red.
Una cuestin bsica de diseo (o estrategia) es si estn integrados en el propio sistema operativo como una extensin del navegador del sistema de ficheros.
Tienen capacidad para trabajar unos protocolos y formatos bsicos y extensiones (plugins) para ampliar su funcionalidad.
El protocolo bsico para obtener la informacin es:

HTTP y HTTPS Manejan tambin otros protocolos como FTP, SMTP, Gopher, telnet, rm
El formato bsico de la informacin que manejan es:

En la generacin actual todos manejan HTML / GIF / JPEG Existe una nueva generacin cuyo formato bsico es XML
Tienen extensiones para manejar muchos otros formatos de ficheros:

MPEG-1, PDF, PostScript,...
Tienen capacidad de procesamiento, pues la mayora incluyen soporte para ejecutar lenguajes de programacin:

DYA
Scripts: JavaScript de Netscape, VBS (Visual Basic Script) de Microsoft Applets de Java.
El servidor Web
Servidores Web
Son, bsicamente, servidores de ficheros que atienden sus peticiones a travs de la red (port 80).
El protocolo bsico es HTTP.
Algunos antiguos estn 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 programacin de CGIs: PHP, shell, Perl, C, ... Servlets: son CGIs hechos en Java (clase JSDK)
DYA
Protocolo HTTP
Establecer conexin TCP C: telnet www.w3.org 80 T: Trying 18.23.0.23 ... T: Connected to www.w3.org T: Escape character is ^[. Peticin C: GET /hypertext/WWW/TheProject.html HTTP/1.0 HTTP C: S: HTTP/1.0 200 Document follows Respuesta S: MIME-Version: 1.0 HTTP S: Server CERN/3.0 Cabecera S: Content-Type: text/html MIME RFC 822 S: Content-Length:8247 S: S: <HEAD> <TITLE> The WWW consortium </TITLE> </HEAD> Cuerpo o S:<BODY> entidad 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
6
DYA
Protocolo HTTP
HTTP: HyperText Transfer Protocol

Definido en RFC1945, RFC2616
http://www.w3.org/pub/WWW/protocols
La interaccin suele realizarse sobre una conexin TCP (aunque no es estrictamente requerido)
Cada elemento de una pgina web suele emplear una conexin TCP/IP
Identificadores de recursos (URL, URI)
http_URL = "http:" "//" host [ ":" port ] [ abs_path [ "?" query ]]

Tipos: de peticin y de respuesta HTTP-message: Request | Response
Mensajes:
DYA
Protocolo HTTP

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:

DYA
Request-Line: GET /hypertext/WWW/TheProject.html Request-Line: GET /hypertext/WWW/TheProject.html HTTP/1.0 Content-Type: Image/GIF <lnea blanco> Status-Line: HTTP/1.0 200 Document follows 200 OK, 304 errores
Protocolo HTTP

Pedir al server devolver un mensaje (cabecera MIME +info)
GET HEAD PUT POST DELETE TRACE CONNECT
Request-URI: identifica la entidad a devolver If-Modified-Since: solicitud condicional. Si no se cumple la condicin 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. Validacin de identificacin y de permisos
Pedir al server aadir o modificar una informacin.

Request-URI: identifica la entidad a almacenar.
Pedir al server eliminar una informacin.

Validacin de identificacin y de permisos
DYA
Pedir al nivel de aplicacin devolver el mensaje original Uso de un proxy como un tunel
9
Protocolo HTTP
HTTP/1.1: campos de la cabecera

Son metainformacin (informacin no contenida en el objeto) Son todos opcionales. Normalmente son campos MIME (RFC 822), pero puede haber
campos no MIME

DYA
Allowed (GET, POST; PUT) Public Content-Length Content-Type Content-Transfer-Encoding Content-Encoding Date Expires Last-Modified Message-Id
Message-Id URI: identificacin del objeto http://www.w3.org/pub/www/doc/url.multi; vary=content-type, language, version Version Derived-From Content-Language Cost Link Title
10
Tecnologa web
Indice
Introduccin
El protocolo HTTP


11

DYA
Servicios web
Estructura de las aplicaciones web
Pginas web simples

Cliente Servidor
WWW server
Pginas web
DYA
12
Aplicaciones web con procesamiento en el cliente: Applets

Cliente Servidor Programa cliente
Programa cliente
Afwpfjpwerjf powertwerq Wqeoweohrowqe woqrejwerjp
WWW server
Pginas web
DYA
Ejemplo: un video-juego 13
Aplicaciones web con procesamiento en cliente y servidor

Cliente Servidor Pginas web Programa servidor (cgi)
Programa cliente
WWW server
Servicio
Base de Datos Nivel almacenamiento Mquina base de datos 14
Nivel cliente
Nivel web Mquina web
Nivel aplicacin
DYA
Servicios web
Computacin distribuida con servicios web
Pginas web HTTP GET, PUT Invocaciones mtodos
WWW server
Servicio
Base de Datos
Nivel cliente
Invocaciones mtodos
DYA
WWW server
Servicio
Base de Datos
Nivel web
Nivel aplicacin
Nivel almacenamiento
15
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 travs del servidor de web.
Como en toda aplicacin distribuida hay que balancear la carga entre el cliente y el servidor.
Se intenta realizar en la parte del cliente el mximo procesamiento posible (los ciclos del servidor son de oro). Comunicacin segura Mantenimiento de la informacin de estado de una conexin. Almacenamiento de informacin persistente.
Algunos aspectos claves de diseo son:

DYA
16
Nivel Cliente
La funcionalidad del cliente se centra en la interaccin con el usuario, lo cual incluye:
Visualizacin de la informacin formateada (en lenguajes de formato) Procesamiento de formularios Procesamiento grfico y multimedia
Nivel Servidor
El servidor, fundamentalmente, realiza procesamiento propio de la semntica de la aplicacin:

Intercambiar informacin con el cliente a travs del servidor web Mantenimiento de informacin de estado con los diferentes clientes
Nivel Almacenamiento
Proporciona acceso a bases de datos a travs de interfaces estndares (ODBC).
17
DYA
Tecnologa web
Indice
Introduccin
El protocolo HTTP


18

DYA
Servicios web
Lenguajes de intercambio de informacin
Lenguajes de marcado
El objetivo de los lenguajes de marcado es proporcionar a la informacin una estructura y un formato (metainformacin).
La forma en que logran esto es acompaando la informacin mediante una serie de etiquetas (marcas).
<ol> <li> Letra normal <li> <b> Letra negrita </b> <li> <i> Letra itlica </i> </ol> 1. Letra normal 1. Letra normal 2. Letra negrita 2. Letra negrita 3. Letra itlica 3. Letra itlica
DYA
19
Lenguajes de intercambio de informacin
Lenguajes de marcado
Objetivos:
Ser lo suficientemente genricos para describir cualquier tipo de documento. Ofrecer un formato de datos universal que permita adaptar o transformar fcilmente la informacin (basndose en etiquetar la informacin con una descripcin). Lenguajes de marcado generales
SGML (Standard Generalized Markup Language). ISO 8879 SGML
XML (eXtensible Markup Languaje). W3C standard
Ejemplos:
Lenguajes de marcado para dominios de aplicacin especficos

HTML: derivado de SGML para realizacin de pginas web. Etc..
DYA
20
XML
XML: Un ejemplo
<?xml version="1.0" encoding="ISO-8859-1" ?> -  - <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>
DYA
</CD> </CATALOG>
21
XML
XML: eXtensible Markup Language

Formato universal para intercambio de informacin.
Sirve para que los programas comuniquen datos e interpreten adecuadamente los tipos de dato. Estructura jerrquica <componente> texto del componente </componente>
Permite especificar informacin con estructura
Su sintaxis es sencilla. Se marca TODO:
Muy flexible: las marcas no son fijas, sino dependientes de la aplicacin. El formato con que debe verse la informacin en un determinado medio se especifica mediante hojas de estilo:

DYA
CSS (Cascading Style Sheets): parcialmente implementado en navegadores web. XSL (eXtended Style Shhet Language): definido por W3C.
22
HTML
HTML: Hypertext Markup Language

Derivado de SGML (subset). Un ejemplo:
<html> <html> <head>  <head>  <title> Ejemplo1 </title> <title> Ejemplo1 </title> </head> </head> <body background=pared.gif text=#0000FF> <body background=pared.gif text=#0000FF> Este es el ejemplo 11de pagina web. Este es el ejemplo de pagina web. La letra es de color azul. La letra es de color azul. </body> </body> </html> </html>
23
DYA
HTML: etiquetas bsicas
Etiquetas para formatear la pgina

Etiqueta <html> ... </html> <head> ... </head> <title> ... </title> <body> ... </body> Descripcin Declara que la pgina web est escrita en HTML Delimita la cabecera de la pgina Delimita el ttulo (no se presenta en la pgina) Delimita el cuerpo de la pgina
Atributos de la etiqueta body

DYA
<body background=pared.gif text=#0000FF> Propiedades del fondo: background, bgcolor, bgsound, bgproperties Mrgenes: leftmargin, topmargin Colores del texto: text, link, vlink, alink
24
HTML
HTML: Hypertext Markup Language

HTML posee etiquetas para proporcionar las siguientes caractersticas:
Formatear la pgina Formatear de texto Realizar listas Realizar tablas Incluir grficos (GIF y JPEG) Realizar marcos en el visor web Realizar hipervnculos Formularios ...
DYA
25
HTML: formularios
Formularios HTML
Permiten realizar pgina web interactivas en las que el cliente proporciona informacin a un programa servidor a travs del servidor web.
DYA
26
DYA
Tipos de formularios
HTML: formularios
27
HTML: formularios
Etiquetas y atributos para formularios

Etiquetas <form>...</form> <input> <textarea> ... </textarea> <select> ... </select> <option> ... </option> Descripcin Delimita la definicin de un formulario Define un formulario de enrtrada Define una rea de texto Define un selector Define un menu de items
Atributos de form Descripcin <form name="..."> Define una etiqueta para el formulario <form method="..."> Define un mtodo para el formulario GET/POST <form action="..."> Define la ubicacin de una accin para el formulario
Los mtodos GET Y POST
DYA
GET: los valores se agregan al URL separados por ?. http://widget.com/cgi-bin/eurocal1.php3?pts=1213445 POST: el cuerpo del mensaje HTTP contiene las variables: pts=1213445 28
HTML: formularios
Etiquetas y atributos para formularios
Atributos de input <input type="..."> <input name="..."> <input value="..."> <input onClick="...">
Descripcin Define el tipo de entrada: text, radio, checkbox, etc. Define una etiqueta para la entrada Define el concepto de la entrada 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 tamao requerido por la entrada <input maxlength="..."> Define el mximo tamao de la entrada
Atributos de textarea <textarea rows="..."> Atributos de select <select name="...">
Descripcin Define el nmero de filas del rea de texto Descripcin Define una etiqueta para el selector
29
DYA
Un ejemplo: la eurocalculadora (el cliente)
La eurocalculadora
DYA
30
Un ejemplo: la eurocalculadora
Programacin a nivel del cliente

Implementado en JavaScript
Realizar comprobaciones sintcticas
Ejemplo: si el campo del formulario queda vaco, no enva la peticin al servidor para su procesamiento. Esto puede realizarse perfectamente a nivel de cliente, sin recurrir al servidor.
Realizar la conversin de pts. a euros
Programacin a nivel del servidor

Implementado en PHP3
(Realizar la conversin de pts. a euros) Llevar un contador con el nmero de visitantes. Realizar un fichero de registro con las IPs de los diferentes clientes que acceden el servicio.
31
DYA
La pgina web en HTML

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <title>Eurocalculadora</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> <script> <!-function verifica() {...} function calcula() {...} //--> </script> </head>
DYA
32
El formulario HTML
<body bgcolor="#f6f2e3" face="charter" link="#4232d9"> <h1>Eurocalculadora</h1> Fique el valor que desitja convertir: <br>
e b d ra we o io ulad ic ervocalc S r eu
<form name="ec" action=" http://www.midominio.com/eurocal.php3" method="post onClick= "return verifica();"> onsubmit="return calcula();"> 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> </select> <input type="submit" name="action" value="Convertir" > </form> </body> </html>
Llamadas a JavaScript
<h3> Quantitat: <input type="text" name="quant" size="20"> </h3>
Campos del formulario

Bot n y fi de en formn del vio ular io
DYA
33
Procesamiento en el lado del cliente

Realizado en JavaScript
<script> <!-function verifica(){ // ============= Check the pts =============== if (document.forms['ec'].quant.value == ""){ alert (" Hi ha que ficar una quantitat!!. "); return false; } // ============= Check the conversion =========== if (document.forms['ec'].conv.selectedIndex == 0){ alert (" Ha de triar el tipus de conversi"); return false; } return true; } //--> </script>
DYA
34
Procesamiento en el lado del cliente

Realizado en JavaScript
<script> <!-function calcula() { $x=document.forms['ec'].pts.quant; if ($x >0){ var opcions='resizable=no,scrollbars=no,menubar=no, dependent=yes,width=400,height=150'; res=window.open("","",opcions); res.document.writeln("<h1>" + $x + " Pts. sn: " + $x/166.38 + " Euros </h1>"); return true; } alert (" Fique una quantitat > 0 "); return false; } //--> </script>
DYA
35
Tecnologa web
Indice
Introduccin
El protocolo HTTP


36

DYA
Servicios web
La interfaz CGI
CGI: Common Gateway Interface

La interfaz CGI define una metodologa para que el servidor Web acomode programas y servicios adicionales que se utilizan para acceder y ejecutar
aplicaciones externas (programas CGI) a los servidores WWW. Su finalidad es procesar informacin solicitada por los clientes (formularios) y devolverles una respuesta. Aplicaciones:

Procesado de formularios Conexin a bases de datos Paquete CERN Paquete NCSA httpd
Las extensiones al servidor Web se proporcionan en forma de paquetes:

DYA
37
La interfaz CGI
xaloc.upv.es
/cgi-bin/ uncgi.exe
N
Nombre DNI
Cliente WWW
Servidor WWW
CGI
Variables E/S estndar CGI redirigidas al servidor web
Base de datos Fichero etc..
DYA
URL: http://xaloc.upv.es/cgi-bin/uncgi.exe
38
La interfaz CGI
Interaccin Servidor Web/programa CGI

Datos de entrada al CGI: el proceso CGI toma datos del cliente a partir de variables CGI. Servidor WWW
En un entorno UNIX el servidor web pasa estas variables al programa CGI como variables de entorno del shell.
env
Datos de salida del CGI: El programa CGI enva su salida al servidor web que, a su vez, la reenva al cliente web.
fork
CGI env
stdout
En un entorno UNIX el CGI pasa estas variables al servidor web mediante una tubera, redirigiendo su salida estndar.
DYA
39
La interfaz CGI
Variables CGI
Uso de variables CGI: se utilizan para pasar los datos relacionados con las peticiones HTTP del servidor a la aplicacin CGI correspondiente.
Tipos de variables:
Variables de entorno: las establece el servidor web a partir de los datos de la conexin y la cabecera de las peticiones. Permiten averiguar datos relativos a la propia peticin (tipo, longitud,...), al cliente (IP, Navegador,...) o al propio servidor (nombre, puerto, software) Variables definidas por el cliente. Existen dos mtodos para pasar estas variables:
GET POST
Acceso a las variables CGI:

DYA
En sistemas UNIX son variables de entorno del shell. En general los lenguajes de programacin para aplicaciones Web proporcionan bibliotecas.
Mas info: http://hoohoo.ncsa.uiuc.edu/cgi/interface.html

40
La interfaz CGI
Variables de entorno CGI

AUTH_TYPE: Protocolo seguido para verificacin de acceso. HTTP proporciona un sencillo mecanismo:
AUTH_TYPE = Basic pide ID y contrasea
CONTENT_LENGTH: Tamao ( en hexadecimal) de octetos de entidad vinculada CONTENT_TYPE: MIME de entidad vinculada
TIPOS application text message image audio video multipart
SUBTIPOS octet-stream (datos de la aplicacin) plain rfc822, partial, external-body gif, jpeg basic mpeg mixed/alternative, digest, parallel
GATEWAY_INTERFACE: versin de CGI del servidor HTTP_(cadena): cabecera de los datos del cliente
DYA
41
La interfaz CGI
Variables de entorno CGI

PATH_INFO: ruta de la aplicacin CGI PATH_TRANSLATED: ruta relativa la sistema operativo de la aplicacin CGI QUERY_STRING: Valor de las variables a pasar a un CGI. Sigue al caracter ? En un URL
http//www.xy.com/cgi-bin/places.pl?Punta_Umbria
REMOTE_ADDR: direccin IP del cliente que hace la peticin. REMOTE_HOST: nombre del dominio del cliente que hace la peticin. 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 aplicacin CGI SERVER_NAME: nombre de dominio o direccin IP del servidor tal como aparece en el URL SERVER_PORT: http//www.xy.com:8119/index.html SERVER_PROTOCOL = HTTP/1.1, SERVER_SOFTWARE= NCSA/1.4 42
DYA
La interfaz CGI
Lenguajes para programacin de CGIs

Ejemplos: Perl, PHP, ASP, Python, Java, etc... Caractersticas:
Manejo de conexiones Acceso a variables CGI Mantenimiento de informacin de estado (sesiones, cookies...) Conexiones a bases de datos Seguridad Envo de archivos
DYA
43
La interfaz CGI
Acceso a variables CGI desde lenguajes de programacin

Ejemplo en PHP5
$_POST[var] es un array de variables predefinida por la que se puede acceder a las
variables enviadas por un formulario con el mtodo 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];} }
DYA
44
Gestin de la informacin de estado
Informacin de estado
En las webs interactivas, es decir, webs donde los clientes realizan algn tipo de transaccin, el servidor necesita mantener informacin de estado de los
diferentes clientes con los que mantiene conexiones.
Ejemplo: En las libreras 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 bsicas de mantener la informacin de estado:

Sesiones: la informacin es mantenida en la parte del servidor Cookies: el servidor enva la cliente la informacin de estado en una cookie. El
cliente la devuelve al servidor al principio de cad interaccin.
DYA
45
Gestin de la informacin de estado
Sesiones
La informacin es mantenida en la parte del servidor. Las sesiones se caracterizan por las siguientes operaciones:
Abrir una sesin (devuelve un identificador) Almacenar u obtener datos de una sesin Invalidar una sesin: manual o automticamente
Cookies
Son objetos que el servidor web puede enviar en la cabecera de una peticin HTTP al visor con informacin codificada. El navegador web:

No puede modificar los cookies. Devuelve los cookies al servidor cada vez que realiza una peticin al mismo.
DYA
Aunque se interrumpa la sesin entre el cliente y el servidor o el servidor muera, se puede reanudar posteriormente la interaccin, pues el cliente guarda en los cookies su informacin de estado. 46
Cookies
2
El navegador web devuelve los cookies al principio de cada interaccin
N
Nombre DNI
Cliente WWW
Servidor WWW
Php3.exe
DYA
1, 4, ...
El servidor www crea y envia los cookies al visor al principio de una interaccin
El servidor pone variables en los cookies y los manipula
47
Un ejemplo: la eurocalculadora (el servidor)
La eurocalculadora
DYA
Pgina dinmica
48
La eurocalculadora
N
Eurocalculadora Quantitat
Cliente WWW eurocal.html <html> <script> function verifica(){ </script> <form name="ec" action="eurocal.php3" onsubmit="return verifica();">
Servidor WWW
Php3.exe
<html> <script> function verifica(){ </script>
eurocal.html
eurocal.php <?php> $pts = $HTTP_POST_VARS["pts"]; echo <html>; .... echo $pts/167 .... echo </html> 49
DYA
<form name="ec" action="eurocal.php3" onsubmit="return verifica();">
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> "; }
DYA
50
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 ); }
DYA
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; }
DYA
52
Procesamiento en el lado del servidor (iv)

<?php ...
// --------------------------- MAIN ----------------------.... echo "<h3>"; echo "$qorg $org equivalen a <font color=\"ff0000\"> $qdst </font> $dst"; echo "</h3>"; escribeIP(); cola();
DYA
?>
53
CGIs
Ejemplo de CGI en Python

#! 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')
DYA
54
Tecnologa web
Indice
Introduccin
El protocolo HTTP


55

DYA
Servicios web
Applets
xaloc.es
Cliente WWW
Servidor WWW
N
http://xaloc.es/echo.html
referencia echo. html migran Servidor echo echoClient. class
echoClient. class
DYA
Mquina virtual java
56
Applets
Applets
Son subclases de la clase Applet
Son objetos grficos (subclases de Component) que se pueden ejecutar en el entorno de un browser de red (siempre que este incluya la mquina virtual). El sistema grfico AWT es representable por el browser de red. Se lanzan desde un fichero en HTML: sto hace migrar el cdigo del URL remoto al browser de red. Tienen algunas limitaciones de seguridad en el acceso a ficheros y recursos de la mquina a la que migran.
57
DYA
Servlets
Servlets
Son una forma de realizar CGIs en Java (server side programming) Tiene capacidades para manipular peticiones y respuesta a formularios HTML
No tienen una interfaz grfica (a diferencia de los Applets)
DYA
58
Servlets
Arquitectura javax.Servlet
Las interfaces
del
Servlet y
paquete
HttpServlet
proporcionan mtodos para gestionar el Applet y manejar las comunicaciones con los clientes. Cuando un servlet acepta una peticin de un cliente recibe dos objetos
DYA
ServletRequest: encapsula la comunicacin del cliente al servlet ServletResponse: encapsula la comunicacin del servlet al cliente
59

Tec Web

Загружено:

Сведения о документе

Оригинальное название

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Tec Web

Загружено:

Авторское право:

Доступные форматы

Diseo Y Aplicaciones de Sistemas Distribuidos

Diseo Y Aplicaciones de Sistemas Distribuidos

Estructura de las aplicaciones web Aplicaciones web: la parte cliente

Aplicaciones web: la parte servidora

Diseo de aplicaciones web en Java

Diseo Y Aplicaciones de Sistemas Distribuidos

Se usa HTTP en esta conexin TCP

Diseo Y Aplicaciones de Sistemas Distribuidos

El protocolo bsico para obtener la informacin es:

El formato bsico de la informacin que manejan es:

Tienen extensiones para manejar muchos otros formatos de ficheros:

Diseo Y Aplicaciones de Sistemas Distribuidos

El protocolo bsico es HTTP.

Diseo Y Aplicaciones de Sistemas Distribuidos

HTTP: HyperText Transfer Protocol

Diseo Y Aplicaciones de Sistemas Distribuidos

Identificadores de recursos (URL, URI)

http_URL = "http:" "//" host [ ":" port ] [ abs_path [ "?" query ]]

HTTP: HyperText Transfer Protocol

Diseo Y Aplicaciones de Sistemas Distribuidos

HTTP: HyperText Transfer Protocol

Diseo Y Aplicaciones de Sistemas Distribuidos

GET HEAD PUT POST DELETE TRACE CONNECT

Pedir al server aadir o modificar una informacin.

Pedir al server eliminar una informacin.

HTTP/1.1: campos de la cabecera

Diseo Y Aplicaciones de Sistemas Distribuidos

Diseo Y Aplicaciones de Sistemas Distribuidos

Estructura de las aplicaciones web Aplicaciones web: la parte cliente

Aplicaciones web: la parte servidora

Diseo de aplicaciones web en Java

Estructura de las aplicaciones web

Pginas web simples

Diseo Y Aplicaciones de Sistemas Distribuidos

Estructura de las aplicaciones web

Aplicaciones web con procesamiento en el cliente: Applets

Diseo Y Aplicaciones de Sistemas Distribuidos

Afwpfjpwerjf powertwerq Wqeoweohrowqe woqrejwerjp

Estructura de las aplicaciones web

Aplicaciones web con procesamiento en cliente y servidor

Diseo Y Aplicaciones de Sistemas Distribuidos

Base de Datos Nivel almacenamiento Mquina base de datos 14

Nivel web Mquina web

Estructura de las aplicaciones web

Diseo Y Aplicaciones de Sistemas Distribuidos

Pginas web HTTP GET, PUT Invocaciones mtodos

Estructura de las aplicaciones web

Aplicaciones web distribuidas

Diseo Y Aplicaciones de Sistemas Distribuidos

Algunos aspectos claves de diseo son:

Estructura de las aplicaciones web

Diseo Y Aplicaciones de Sistemas Distribuidos

Diseo Y Aplicaciones de Sistemas Distribuidos

Estructura de las aplicaciones web Aplicaciones web: la parte cliente

Aplicaciones web: la parte servidora

Diseo de aplicaciones web en Java

Lenguajes de intercambio de informacin

Diseo Y Aplicaciones de Sistemas Distribuidos

Lenguajes de intercambio de informacin

Diseo Y Aplicaciones de Sistemas Distribuidos

Lenguajes de marcado para dominios de aplicacin especficos

Diseo Y Aplicaciones de Sistemas Distribuidos

XML: eXtensible Markup Language