PDF de programación - 1.1 Aplicaciones Web

Unidad I

1.1 Aplicaciones Web

Introducción (I)
! El desarrollo de páginas web (Web

Development) se divide básicamente en
dos vertientes:
! Diseño gráfico (WebDesign)
! Programación Web (WebProgramming)
! Nueva: WebEngineering(Ingeniería del

Software aplicada a la web)



Programación WebIng. Isabel León P.1 Introducción (II)
! Diseño gráfico

! Se centra en la estética de la web.
! Herramientas: Dreamweaver, Flash, Photoshop,

herramientas WYSIWYG, etc.

! Programación web

! Se centra en el desarrollo de aplicaciones web:
aplicaciones informáticas basadas en la WWW.

! Tecnologías: lenguajes etiquetados (XHTML,

XML,...), páginas activas (ASP, JSP, PHP,...), bases
de datos (Access, SQL Server, Oracle,...).

Introducción (III)
! Ejemplos de aplicaciones web:

! Sistema de inscripción a los cursillos.
! Compra de entradas.
! Banca On-Line.
! Guía Telefónica On-line.
! Consulta de calificaciones académicas.
! Comercio electrónico (p.ej. tiendas virtuales)
! Etc, etc, etc.

! Una aplicación web no es más que una

aplicación cliente/servidorque se apoya en la
WWW (sus tecnologías, lenguajes,
protocolos,...)



Programación WebIng. Isabel León P.2 Aplicaciones Cliente/Servidor
(I)
! Normalmente (y tradicionalmente)
nuestro software (o `aplicaciones’)
residen en nuestro ordenador, donde
tienen todos los recursos que necesitan.
Su código ejecutable, sus datos, etc.
! Con el advenimiento de las redes de

comunicación, apareció un nuevo tipo
de aplicación: la aplicación
cliente/servidor.

Aplicaciones Cliente/Servidor
(II)
! Aplicación cliente/servidor: Software
dividido en dos partes que residen en
ordenadores distintos. En la parte del
servidor se centralizan los datos y el
proceso de datos. Los clientes se limitan
a enviar peticiones de servicios al
servidor y a recibir sus respuestas.

! Recordemos: El modelo cliente/servidor.

Programación WebIng. Isabel León P.3 Aplicaciones Cliente/Servidor
(III)
! Ejemplo: Un banco. Cuando hacemos

un ingreso, el cajero introduce los datos
del ingreso en su ordenador. ¡Esos
datos no se almacenan en su
ordenador! Son enviados a un `gran
superordenador central’ que procesa los
datos, los almacena, y envía una
respuesta (‘ingreso correcto’, ‘error en
numero de cuenta’, etc.) al cajero.

Aplicaciones Cliente/Servidor
(IV)
! El ‘programa cliente’ es sencillo y

(normalmente) realiza poco proceso de
datos. Se limita a enviar peticiones al
servidor, y mostrar las respuestas que
le llegan del servidor al usuario. En el
ejemplo, el programa cliente es el que
tiene el cajero en su ordenador.

Programación WebIng. Isabel León P.4 Aplicaciones Cliente/Servidor
(V)
! El `programa servidor’ realiza el grueso
del proceso de datos. Recibe peticiones
de los clientes (¡puede haber más de
uno!) y las atiende. Es el que maneja
directamente la base de datos. En el
ejemplo, el ‘gran superordenador
central’ es el programa servidor.

Aplicaciones Cliente/Servidor
(VI)

Cliente

Servidor

Interfaz
Gráfico

Lógica de
Negocio

Base de Datos

1. El cajero de un banco quiere averiguar qué clientes se encuentran en

una situación financiera muy concreta (que requiere un cálculo no
trivial).

2. La aplicación cliente pide a la aplicación servidor que le devuelva
todos los datos de todos clientes. El servidor responde con esos
datos.

3. La lógica de negocio, en el cliente, recorre los datos de los clientes y

averigua cuales cumplen dicha condición.

Programación WebIng. Isabel León P.5 Aplicaciones Cliente/Servidor
(VII)
! Este tipo de aplicación cliente/servidor

se llama `cliente pesado’.
! El cliente realiza todo el proceso de datos.
! El servidor actúa prácticamente como un

disco duro remoto. No realiza ningún
proceso de datos.

! Si los datos de cada cliente ocupan 10 KB,

y hay 1.000.000 clientes...¡habría que
enviar 10 GigaBytes de información para
realizar esa consulta! (¡y cualquier
consulta!)

Aplicaciones Cliente/Servidor
(VIII)

Cliente

Servidor

Interfaz
Gráfico

Lógica de
Negocio

Base de Datos

1. El cajero de un banco quiere averiguar qué clientes se encuentran en

una situación financiera muy concreta (que requiere un cálculo no
trivial).

2. La aplicación cliente pide a la aplicación servidor que averigüe qué

4. La aplicación servidor responde a la aplicación cliente con esos datos.

3. La aplicación servidor, utilizando el SGBD, obtiene los resultados de

clientes cumplen esa condición.

la consulta (p.ej. 50 clientes)

Programación WebIng. Isabel León P.6 Aplicaciones Cliente/Servidor
(IX)
! Este tipo de aplicación cliente/servidor

se llama `cliente ligero’.
! El cliente apenas realiza proceso de datos.
! El servidor (la lógica de negocio y el SGBD)

realizan prácticamente todo el proceso de
datos.

! Solo se envían 10KB * 50 clientes = 500

KiloBytes.

¡¡¡ 500 KB <<< 10 GB !!!

Aplicaciones Web (I)
! Con la llegada de la web, las aplicaciones

cliente/servidor han evolucionado hacia las
aplicaciones web.

! Conceptualmente, una aplicación web es lo

mismo que una aplicación cliente/servidor. Lo
único que cambia es el soporte. La aplicación
cliente/servidor se apoyará en páginas web,
navegadores de Internet, servidores web,
etc.

Programación WebIng. Isabel León P.7 Aplicaciones Web (II)

Aplicación Cliente—Servidor

Aplicación Web

Aplicación

Cliente

Software específicamente
programado, que el cliente tiene
que tener instalado.

El navegador de Internet. El
cliente no tiene que instalar
nada más, porque las
‘respuestas del servidor’ le llegan
en forma de páginas web.

Interfaz

Aplicación
Servidor

Protocolo

Parecido a cualquier aplicación del
sistema (p.ej: ventanas, menús,
interfaz de comandos)

Páginas web programadas en
HTML.

Software específicamente
programado que debe estar
instalado en el servidor.
Cualquier protocolo de
comunicaciones (generalmente,
basado en TCP/IP).

Software específicamente
programado que debe ser
ejecutado por un servidor web.

Protocolo HTTP

Aplicaciones Web (III)
! Una aplicación web es una aplicación
cliente/servidor de tipo ‘cliente ligero’.

! Toda la aplicación reside en un servidor web.

El usuario (cliente) unicamente tiene que
‘bajarse’ a su ordenador las páginas web que
representan el interfaz de la aplicación.
! Según algunos: `cliente ultraligero’ " el cliente ni

siquiera tiene que instalar una aplicación cliente,
ya que utiliza un navegador web (que ya viene
incluido con practicamente todos los sistemas
operativos)

Programación WebIng. Isabel León P.8 Aplicaciones Web (IV)
! Actualmente, las aplicaciones están

limitadas por tecnologías que no fueron
diseñadas pensando en estas
aplicaciones: HTML, HTTP, etc.

! El futuro: romper con estas

limitaciones. XHTML, XML, SOAP,
objetos distribuidos, etc.

Programación WebIng. Isabel León P.9 1.2
Servidores Web

Servidores Web (I)
! Una página web puede visualizarse

cómodamente en nuestro propio
ordenador, sin acceder a Internet.

! Para que nuestras páginas sean visibles

en la WWW, es necesario ubicarlas en
un servidor web.

Programación WebIng. Isabel León P.10 Servidores Web (II)
! Servidor web: Un ordenador que

proporciona documentos web (HTML,
GIF, JPG, MOV, PDF, etc.) a los clientes.

! En el servidor web debemos tener

instalado ‘software de servidor web’
(una aplicación servidor que atiende las
peticiones de los navegadores web)
! ¡Ojo! “Servidor web” sirve para denominar

tanto al ordenador como al software.

Servidores Web (III)
! Servidores Web (software) más

utilizados:
! Microsoft Internet Information Server (IIS).
Solamente para Windows NT (versión 4) y
Windows 2000 (versión 5).

! Apache. Multiplataforma, aunque la versión

más estable siempre es la de UNIX.

Programación WebIng. Isabel León P.11 1

Petición del Cliente

2

3

Cliente

“El que quiere ver

páginas web”

4

INTERNET

Servidor

“El que suministra

páginas web”

5

Respuesta del Servidor

¿Cómo se comunican el cliente
y el servidor web? (I)
! 1- El cliente quiere ver una página web. Por

ejemplo:
http://www.eside.deusto.es/profesorado/default.asp

! 2- Envía una petición al servidor:

“Hola servidor www.eside.deusto.es. Soy el
cliente 123.123.123.123. Quiero que me
envies el documento
/profesorado/default.asp”
Petición " Utilizando el protocolo HTTP

Programación WebIng. Isabel León P.12 ¿Cómo se comunican el cliente
y el servidor web? (II)
! 3- El servidor recibe la petición y la

procesa.

! 4- El servidor envía una respuesta al

cliente.
Respuesta " Utilizando protocolo HTTP

¿Cómo se comunican el cliente
y el servidor web? (III)
! Posibles respuestas:

! “Hola cliente. Soy www.eside.deusto.es. He
encontrado el documento que me pides, y
va adjunto a esta respuesta.”

! “Hola cliente. Soy www.eside.deusto.es. Lo

siento mucho, pero no he encontrado el
documento que me pides.”
¡Error 404!

Programación WebIng. Isabel León P.13 ¿Cómo se comunican el cliente
y el servidor web? (IV)
! 5- El cliente recibe el documento, y lo

procesa. Por ejemplo, si es un
documento HTML:
! Enviar peticiones para las imágenes, los

videos, etc. (contenido embebido)

! Ejecutar JavaScript
! Visualizar por pantalla

1

T
E
N
R
E
T
N
I

Petición del cliente

2

Servidor Web (Ordenador)

3

Software del Servidor Web
(Internet Information Server,

Apache, etc.)

5

Disco Duro
del Ordenador

4

R e s p u e s t a d e l
i e n t e
c l
s e r v i d o r

a l

Programación WebIng. Isabel León P.14 ¿Qué ocurre en el servidor
web? (I)
! 1- Llega una petición del cliente.
! 2- El servidor recibe la petición y la

procesa. Analiza la petición y decide lo
que tiene que hacer.
! ¿Qué me pide el cliente?
! ¿Accedo al disco duro?
! ¿Envío un mensaje de error?
! Etc.

¿Qué ocurre en el s