Temario:

2 Desarrollo de aplicaciones Web

2.1 Arquitectura de las aplicaciones Web.
2.2 Lenguajes de programación del lado del cliente.
2.3 Lenguajes de programación del lado del servidor.
2.4 Ambientes para el desarrollo de aplicaciones Web.
2.5 Metodologías para el desarrollo de aplicaciones Web.
2.6 Aspectos de seguridad.

2 Desarrollo de aplicaciones Web

2.1 Arquitectura de las aplicaciones Web.
Una aplicación Web es proporcionada por un servidor Web y utilizada por usuarios que se
conectan desde cualquier punto vía clientes Web (browsers o navegadores). La arquitectura de un
sitio Web tiene tres componentes principales:
Un servidor Web
Una conexión de red
Uno o más clientes.

El servidor Web distribuye páginas de información formateada a los clientes que las solicitan. Los
requerimientos son hechos a través de una conexión de red, y para ello se usa el protocolo HTTP.
Una vez que se solicita esta petición mediante el protocolo HTTP y la recibe el servidor Web, éste
localiza la página Web en su sistema de archivos y la envía de vuelta al navegador que la solicitó.

Las aplicaciones Web están basadas en el modelo Cliente/Servidor que gestionan servidores web,
y que utilizan como interfaz páginas web.
Las páginas Web son el componente principal de una aplicación o sitio Web. Los browsers piden
páginas (almacenadas o creadas dinámicamente) con información a los servidores Web. En
algunos ambientes de desarrollo de aplicaciones Web, las páginas contienen código HTML y
scripts dinámicos, que son ejecutados por el servidor antes de entregar la página.

1
Una vez que se entrega una página, la conexión entre el browser y el servidor Web se rompe, es
decir que la lógica del negocio en el servidor solamente se activa por la ejecución de los scripts de
las páginas solicitadas por el browser (en el servidor, no en el cliente). Cuando el browser ejecuta
un script en el cliente, éste no tiene acceso directo a los recursos del servidor.
Hay otros componentes que no son scripts, como los applets (una aplicación especial que se
ejecuta dentro de un navegador) o los componentes ActiveX. Los scripts del cliente son por lo
general código JavaScript o VBSscript, mezclados con código HTML.

La colección de páginas son en una buena parte dinámicas (ASP, PHP, etc.), y están agrupadas
lógicamente para dar un servicio al usuario.
El acceso a las páginas está agrupado también en el tiempo (sesión).
Los componentes de una aplicación Web son:
1. Lógica de negocio.
Parte más importante de la aplicación.
Define los procesos que involucran a la aplicación.
Conjunto de operaciones requeridas para proveer el servicio.
2. Administración de los datos.
Manipulación de BD y archivos.
3. Interfaz
Los usuarios acceden a través de navegadores, móviles, PDAs, etc.
Funcionalidad accesible a través del navegador.
Limitada y dirigida por la aplicación.
Las aplicaciones web se modelan mediante lo que se conoce como modelo de capas, Una capa
representa un elemento que procesa o trata información.
Los tipos son:
Modelo de dos capas: La información atraviesa dos capas entre la interfaz y la
administración de los datos.
Modelo de n-capas: La información atraviesa varias capas, el más habitual es el modelo de
tres capas.

Modelo de dos Capas.

Gran parte de la aplicación corre en el lado del cliente (fat client).
Las capas son:
Cliente (fat client): La lógica de negocio está inmersa dentro de la aplicación que realiza el
interfaz de usuario, en el lado del cliente.
Servidor: Administra los datos.
Las limitaciones de este modelo son.
Es difícilmente escalable
Número de conexiones reducida
Alta carga de la red.
La flexibilidad es restringida
La funcionalidad es limitada.

2
Modelo de tres Capas.
Esta diseñada para superar las limitaciones de las arquitecturas ajustadas al modelo de dos capas,
introduce una capa intermedia (la capa de proceso)
Entre presentación y los datos, los procesos pueden ser manejados de forma separada a la
interfaz de usuario y a los datos, esta capa intermedia centraliza la lógica de negocio, haciendo la
administración más sencilla, los datos se pueden integrar de múltiples fuentes, las aplicaciones
web actuales se ajustan a este modelo.
Las capas de este modelo son:
1. Capa de presentación (parte en el cliente y parte en el servidor)
Recoge la información del usuario y la envía al servidor (cliente)
Manda información a la capa de proceso para su procesado
Recibe los resultados de la capa de proceso
Generan la presentación
Visualizan la presentación al usuario (cliente)
2. Capa de proceso (servidor web)
Recibe la entrada de datos de la capa de presentación
Interactúa con la capa de datos para realizar operaciones
Manda los resultados procesados a la capa de presentación
3. Capa de datos (servidor de datos)
Almacena los datos
Recupera datos
Mantiene los datos
segura la integridad de los datos

3
2.2 Lenguajes de programación del lado del cliente.

Los lenguajes de programación del lado cliente se usan para su integración en páginas web. Un
código escrito en un lenguaje de script se incorpora directamente dentro de un código HTML y se
ejecuta interpretado, no compilado.

Con la programación del lado del cliente se pueden validar algunos de los datos en la máquina
cliente antes de enviarlos al servidor. Esto proporciona a los usuarios informes de error inmediatos,
mientras siguen en esa página de formulario y sin necesidad de volver atrás tras recibir un mensaje
de error. Puede resultar necesario acceder a una base de datos para validar determinados valores,
mientras que no suele disponer de un acceso directo a la base de datos en la máquina del cliente,
aunque ese acceso a la base de datos es factible.

Para incorporar un fragmento de código script en una página HTML se introduce el script entre los
tags <SCRIPT> y </SCRIPT> . Dos son los lenguajes de script que hay en la actualidad: el
VBScript (derivado de Visual Basic) y el JavaScript (derivado de Java)

Vbscript (Visual Basic Script): Es un lenguaje de script, directamente derivado de Visual Basic.
Para insertar código VBScript en una página HTML se añade al tag <SCRIPT> el parámetro
LANGUAGE="VBScript" , que determina cual de los lenguajes de script se utiliza.
Decimos que los lenguajes de script se ejecutan interpretados, no compilados. Esto significa que
un código escrito en un lenguaje de script no sufre ninguna transformación previa a su ejecución.
Cada línea de código es traducida a lenguaje máquina justo antes de su ejecución. Después es
ejecutada y la traducción no se conserva en ningún sistema de almacenamiento (como discos,
cintas, etc.). Si es necesaria otra ejecución, el intérprete se verá abocado a realizar una nueva
traducción de cada línea de código. Sin embargo el lenguaje Visual Basic, del cual deriva el
VBScript, es un leguaje compilado. Esto significa que un código en Visual Basic sufre un proceso
global de traducción a lenguaje máquina. Todo el código es traducido de una sola vez y el
resultado de esa traducción se almacena en el disco con la extensión .EXE.
Cuando llega el momento de la ejecución, se ejecuta el código compilado, no el código original del
programa (llamado código nativo o código fuente). Cada sistema tiene sus ventajas e
inconvenientes.

4
Las ventajas e inconvenientes de la interpretación son:

El código es cómodo para depurar, ya que no es necesario volver a compilar tras un

cambio.
No es necesario disponer de un compilador, ya que el intérprete (que forma parte del
navegador) ejecuta el script.
El mantenimiento es fácil y rápido, por parte del autor o de otro programador.
La ejecución se ralentiza, al ser necesaria la interpretación línea a línea cada vez.
El código es visible y puede ser objeto de plagio por parte de otras personas.
El usuario tiene acceso al código y puede modificarlo, estropeando alguna operación.

Las ventajas e inconvenientes de la compilación son:

El código compilado se ejecuta muy rápido, al no ser necesaria una traducción cada vez.
El código compilado no puede ser "abierto" por otras personas. No es necesario transmitir
el código fuente.
El código compilado puede estar, íntegramente, incluido en un solo fichero.
Es necesario disponer de un compilador-linkador para el proceso de la compilación.
El código compilado suele ocupar bastante en disco, ya que incorpora en el propio código
algunas librerías del sistema.
Depurar un programa implica volver a compilar tras los cambios.

El código en VBScript puede, además, estar diseñado para su ejecución en el lado del cliente o en
el del servidor. La diferencia es que un código que se ejecuta en el lado del servidor no es visible
en el lado del cliente. Este recibe los resultados, pero no el código. El código que se debe de
ejecutar en el lado del servidor estará incluido en la página web correspondiente entre los tags <%
y %>. Además habrá que renombrar la página para aplicarle la extensión .asp (Active Server Page
-página activa en servidor-). El funcionamiento intrínseco de la ASP se especificará con mayor
detalle en el capítulo 3. Lenguajes del servidor

Un ejemplo de una sencillísima página web que incluye código VBScript:

<HTML>
<HEAD>
<TITLE>Cuadro de mensaje</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "VBScript">
MSGBOX ("Ejemplo de mensaje")
</SCRIPT>
</BODY>
</HTML>

Este código incluye la instrucción MSGBOX ("Cuadro de mensaje"), que genera en pantalla lo
siguiente:

JavaScript:

JavaScript es un lenguaje de scripts compacto basado en objetos (y no orientado a objetos).

Originariamente era denominado LiveScript, y fue desarrollado por Netscape para su navegador
Netscape Navigator 2.0. Fue éste el primer cliente en incorporarlo. Se ejecuta sobre 16 plataformas
diferentes, incluyendo los entornos de Microsoft.

5
Las diferentes versiones de JavaScript han sido finalmente integradas en un estándar denominado
ECMAScript-262. Dicho estándar ha sido realizado por la organización ECMA dedicada a la
estandarización de información y sistemas de comunicación. Las versiones actuales de los
navegadores soportan este estándar.

JavaScript permite la realización de aplicaciones de propósito general a través de la WWW y

aunque no está diseñado para el desarrollo de grandes aplicaciones es suficiente para la
implementación de aplicaciones WWW completas o interfaces WWW hacia otras más complejas.

Por ejemplo, una aplicación escrita en JavaScript puede ser incrustada en un documento HTML
proporcionando un mecanismo para la detección y tratamiento de eventos, como clicks del ratón o
validación de entradas realizadas en formularios.

Sin existir comunicación a través de la red una página HTML con JavaScript incrustado puede
interpretar, y alertar al usuario con una ventana de diálogo, de que las entradas de los formularios
no son válidas. O bien realizar algún tipo de acción como ejecutar un fichero de sonido, un applet
de Java, etc.

<html>
</head>
<body>
<br>
Este es un documento HTML normal
<br>
<script language="JavaScript">
document.write("Esto es JavaScript!")
</script>
<br>
En HTML otra vez.
</body>
</html>

Este primer programa se limita a escribir en pantalla un determinado texto para lo que se emplea el
código document.write. En este código, document es un objeto creado por el sistema que hace
referencia al propio documento y write es uno de los métodos que proporciona para interactuar con
él. El resultado de cargar este documento en un visualizador que interprete JavaScript será la
aparición de los dos textos, el escrito en JavaScript y el escrito en HTML, sin que el usuario sea
consciente del proceso.

Podemos hablar también de páginas dinámicas del servidor, que son reconocidas, interpretadas y
ejecutadas por el propio servidor.

2.3 Lenguajes de programación del lado del servidor.

Los Lenguajes de programación del lado del servidor son especialmente útiles en trabajos que se
tiene que acceder a información centralizada, situada en una base de datos en el servidor, y
cuando por razones de seguridad los cálculos no se pueden realizar en la computadora del
usuario.

Es importante destacar que los lenguajes de programación del lado del servidor son necesarios
porque para hacer la mayoría de las aplicaciones web se debe tener acceso a muchos recursos
externos a la computadora del cliente, principalmente bases de datos alojadas en servidores de

6
Internet. Un caso claro es un banco: no tiene ningún sentido que el cliente tenga acceso a toda la
base de datos, sólo a la información que le concierne.

Las páginas dinámicas del servidor se suelen escribir en el mismo archivo HTML, mezclado con el
código HTML, al igual que ocurría en las páginas del cliente. Cuando una página es solicitada por
parte de un cliente, el servidor ejecuta los scripts y se genera una página resultado, que solamente
contiene código HTML. Este resultado final es el que se envía al cliente y puede ser interpretado
sin lugar a errores ni incompatibilidades, puesto que sólo contiene HTML.

Luego es el servidor el que maneja toda la información de las bases de datos y cualquier otro
recurso, como imágenes o servidores de correo y luego envía al cliente una página web con los
resultados de todas las operaciones.

Las ventajas de este tipo de programación son que el cliente no puede ver los scripts, ya que se
ejecutan y transforman en HTML antes de enviarlos. Además son independientes del navegador
del usuario, ya que el código que reciben es HTML fácilmente interpretable.

Como desventajas se puede señalar que será necesario un servidor más potente y con más
capacidades que el necesario para las páginas de cliente. Además, estos servidores podrán
soportar menos usuarios concurrentes, porque se requerirá más tiempo de procesamiento para
cada uno.

Para escribir páginas dinámicas de servidor existen varios lenguajes.

Practical Extraction and Report Language ( PERL): es un lenguaje de programación
desarrollado por Larry Wall (lwall at netlabs.com) inspirado en otras herramientas de UNIX.
PERL es el lenguaje más utilizado para la creación de programas CGI en los servidores web.
Es más rápido que los programas shell script de UNIX, puede leer y escribir ficheros binarios, y
puede procesar ficheros grandes. La ventaja más importante de PERL sobre C es que PERL
no necesita ser recompilado, es un lenguaje interpretado.
Active Server Pages (ASP): es una tecnología del lado servidor de Microsoft para páginas web
generadas dinámicamente, que ha sido comercializada como un anexo a Internet Information
Server (IIS). EL estándard ASP permite poder utilizar cualquier lenguaje para la programación,
si bien Microsoft favorece que se utilice el VBScript, y en segundo término el JScript (versión
del estándard Javascript hecha por Microsoft). En teoría, y mediante la programación, es
posible adaptar versiones de lenguajes como Pascal, C y otros, para utilizarlos dentro de
páginas ASP.
Java Server Pages (JSP): es la tecnología para generar páginas web de forma dinámica en el
servidor, desarrollado por Sun Microsystems, basado en scripts que utilizan una variante del
lenguaje Java. La tecnología JSP, o de JavaServer Pages, es una tecnología Java que permite
a los programadores generar dinámicamente HTML, XML o algún otro tipo de página web. Esta
tecnología permite al código Java y a algunas acciones predefinidas ser embebidas en el
contenido estático. La principal ventaja de JSP frente a otros lenguajes es que permite
integrarse con clases Java (.class) lo que permite separar en niveles las aplicaciones web,
almacenando en clases java las partes que consumen más recursos así como las que
requieren más seguridad, y dejando la parte encargada de formatear el documento 'html ' en el
archivo jsp. Además Java se caracteriza por ser un lenguaje que puede ejecutarse en cualquier
sistema, lo que sumado a jsp le da mucha versatilidad.
Hipertext Preprocesor (PHP): PHP (acrónimo recursivo de "PHP: Hypertext Preprocessor",
originado inicialmente del nombre PHP Tools, o Personal Home Page Tools) es un lenguaje de
programación interpretado. Aunque fue concebido en el tercer trimestre de 1994 por Rasmus
Lerdorf no fue hasta el día 8 de Junio de 1995 que fue lanzada la versión 1.0. Se utiliza entre
otras cosas para la programación de páginas web activas, y se destaca por su capacidad de
mezclarse con el código HTML. Aunque su creación y desarrollo se da en el ámbito de los
sistemas libres, bajo la licencia GNU, existe además un compilador comercial denominado
(Zend Optimizer). El desarrollo del código abierto por un lado y el firme respaldo comercial por
el otro, han llevado a PHP a alcanzar una popularidad más que notable. El nuevo soporte

7
 JAVA y DCOM, las avanzadas características de XML y las mejoras de la programación
orientada a objetos (POO) que incorpora su última versión PHP5, han incrementado la
aceptación de PHP en entornos comerciales, y lo han convertido en una herramienta viable
para la programación en entornos empresariales.

2.4 Ambientes para el desarrollo de aplicaciones Web

Un ambiente de desarrollo para aplicaciones web es una estructura definida, reusable en el que
sus componentes facilitan la creación de aplicaciones web. En cierto sentido podemos afirmar que
nos proveen una capa de abstracción sobre la arquitectura original ocultándola o adaptándola para
no tener que utilizar el protocolo http de manera nativa y así acelerar los tiempos de desarrollo y
mantenimiento.

Los ambientes de desarrollo más importantes son los siguientes:

FrontPage.- Es un programa de Microsoft para a crear y mantener sitios web. Permite

diseñar y crear páginas directamente en el propio sitio de Internet, así como en una
computadora personal y luego publicarlas por completo en un servidor. Con este software
se pueden elaborar páginas sin saber absolutamente nada del lenguaje HTML, se escriben
los textos, se les da formato, y se le insertan imágenes mientras el programa elabora el
código HTML correspondiente que es el que entienden los navegadores de internet.
Dreamweaver.- Es un editor visual profesional para la creación y administración de sitios y
páginas Web. Con Dreamweaver resulta fácil crear y editar páginas compatibles con
cualquier explorador y plataforma. Dreamweaver proporciona herramientas avanzadas de
diseño y formateo, y facilita el uso de funciones de HTML dinámico, como capas y
comportamientos animados, sin necesidad de escribir una sola línea de código. El
establecimiento de destino de exploradores comprueba el trabajo para averiguar si hay
problemas potenciales en las plataformas y los exploradores más habituales. La tecnología
Roundtrip HTML de Macromedia importa documentos HTML sin necesidad de cambiar el
formato del código y, además, es posible configurar Dreamweaver para limpiar y cambiar el
formato HTML cuando lo desee. Dreamweaver se puede personalizar totalmente. Puede
crear sus propios objetos y comandos, modificar menús y métodos abreviados de teclado,
e incluso escribir código JavaScript para ampliar las posibilidades que ofrece Dreamweaver
con nuevos comportamientos e inspectores de propiedades.
ASP.NET: es un conjunto de tecnologías definidas por Microsoft para la capa de
presentación WEB que forma parte del .NET Framework. En pocas palabras, una página
ASP.NET es un archivo de texto con extensión aspx que el servidor sabe que debe
procesar de una manera especial. El texto de las páginas puede ser html junto con código
scripting que se compila dinámicamente y se ejecuta en el servidor. La página aspx se
compila (sólo la primera vez) a código ejecutable .net cuando algún cliente la solicita al
servidor. Para incluir código embebido en la página se utilizan los separadores <% y %>.
En este sentido es similar al funcionamiento de las páginas JSP de java. Las páginas
ASP.NET pueden tener controles que se ejecutan del lado del servidor (server controls)
que son objetos que representan elementos de la interfaz de usuario que se ejecutan en el
servidor y generan código html como resultado de su ejecución. Los controles tienen
propiedades, métodos y eventos a los que pueden responder y mediante los que se puede
modificar su estado y comportamiento. Este comportamiento se puede declarar en los
atributos de su declaración html o de manera programática. Los controles permiten
contener otros controles dentro de ellos y es posible, al igual que cualquier objeto, heredar
y redefinir parte de su comportamiento. Un control de servidor se identifica en una página
html por su atributo runat="server". De esta manera un webform es una página html que
contiene en algún lado una etiqueta del estilo:
Eclipse es un proyecto de desarrollo de software de código fuente abierto cuyo objetivo es
la construcción de herramientas integradas para el desarrollo de aplicaciones, este a su

8
 vez se compone de diversos subproyectos entre los cuales esta el Eclipse Web Tools
Platform (WTP), el cual contiene herramientas para el desarrollo de aplicaciones web, que
incluyen editores gráficos para simplificar el desarrollo.

2.5 Metodologías para el desarrollo de aplicaciones Web.

A lo largo de los últimos años, se han planteado diferentes propuestas para la creación de
aplicaciones Web en base a modelos conceptuales. Estos modelos tienen como objetivo principal
el desarrollo de aplicaciones Web basadas en grandes cantidades de datos. Este tipo de modelos
tiene en cuenta los diferentes elementos de información, organizados generalmente en páginas
enlazadas que permiten estructurar los elementos y la navegación de la aplicación.
En este sentido, la casi totalidad de estos modelos disponen de diferentes representaciones que
permiten expresar los conceptos implicados en el diseño y desarrollo de una aplicación Web
utilizando la noción de capas encapsuladas que dividen los objetivos en diferentes niveles según la
responsabilidad requerida. Mediante esta división, cada una de las capas puede ser especificada
de manera independientemente, definiendo en cada una modelos como pueden ser los de datos,
navegación, etc.
Las metodologías más usadas son:

1. RMM Relationship Management Methodology: se define como un proceso de análisis,

diseño y desarrollo de aplicaciones hipermedia. Esta metodología es apropiada para
dominios con estructuras regulares es decir, con clases de objetos bien definidas, y con
claras relaciones entre esas clases. Por ejemplo, catálogos o bases de datos
tradicionales. El modelo propone un lenguaje que permite describir los objetos del
dominio, sus interrelaciones y los mecanismos de navegación hipermedia de la aplicación.
Los objetos del dominio se definen con la ayuda de entidades, atributos y relaciones
asociativas, sus principales características son:

Aproximación para el diseño de sitios web, bajo una aproximación centrada en la

información.
Lenguaje de modelado de sitios web a nivel lógico (dominio de información +
estructuras de navegación + elementos de presentación)
Integrado en una metodología de desarrollo
Facilitar la estructuración de páginas web complejas que contienen elementos de
distintas entidades (vistas múltiples)
Permitir la reutilización de elementos en el diseño (vistas jerárquicas)
Diseño de enlaces más potentes y versátiles
Mantener el contexto durante la navegación

2. OOHDM Object Oriented Hypermedia Design Method: OOHDM propone el desarrollo de

aplicaciones hipermedia a través de un proceso compuesto por cuatro etapas: diseño
conceptual, diseño navegacional, diseño de interfaces abstractas e implementación.
Diseño Conceptual. En OOHDM, el desarrollo se inicia diseñando la capa
conceptual, siendo el principal objetivo de esta etapa capturar los conceptos
involucrados en el dominio de la aplicación y describirlos en detalle, haciendo uso
de diagramas que permitan expresar con claridad el comportamiento, la estructura
y las relaciones entre dichos conceptos. La Programación Orientada a Objetos
facilita el traslado del diseño conceptual a la implementación, proveyendo al
programador con herramientas que permiten reducir la distancia entre el problema
del mundo real y la programación de la solución en la computadora.
Diseño Navegacional. La capa navegacional se compone de objetos construidos a
partir de objetos conceptuales, y constituyen en general los elementos canónicos
de las aplicaciones hipermedia tradicionales: nodos, enlaces, anclas y estructuras
de acceso. Sin embargo, estas clases pueden extender el comportamiento

9
 característico para funcionar como adaptadores de los objetos conceptuales y
delegar así operaciones específicas del dominio. Entonces, los objetos
navegacionales pueden actuar como observadores, para construir vistas de
objetos conceptuales, y como adaptadores, para extender la actividad
navegacional de un nodo y poder aprovechar el comportamiento conceptual del
objeto adaptado.
Diseño de Interfaz Abstracta. Una vez que las estructuras navegacionales son
definidas, se deben especificar los aspectos de interfaz. Esto significa definir la
forma en la cual los objetos navegacionales pueden aparecer, cómo los objetos de
interfaz activarán la navegación y el resto de la funcionalidad de la aplicación, qué
transformaciones de la interfaz son pertinentes y cuándo es necesario realizarlas.
Una clara separación entre diseño navegacional y diseño de interfaz abstracta
permite construir diferentes interfaces para el mismo modelo navegacional,
dejando un alto grado de independencia de la tecnología de interfaz de usuario. El
aspecto de la interfaz de usuario de aplicaciones interactivas (en particular las
aplicaciones web) es un punto crítico en el desarrollo que las modernas
metodologías tienden a descuidar. En OOHDM se utiliza el diseño de interfaz
abstracta para describir la interfaz del usuario de la aplicación de hipermedia. El
modelo de interfaz ADVs (Vista de Datos Abstracta) especifica la organización y
comportamiento de la interfaz, pero la apariencia física real o de los atributos, y la
disposición de las propiedades de las ADVs en la pantalla real son hechas en la
fase de implementación.
Implementación. En esta fase, el diseñador debe implementar el diseño. Hasta
ahora, todos los modelos fueron construidos en forma independiente de la
plataforma de implementación; en esta fase es tenido en cuenta el entorno
particular en el cual se va a correr la aplicación. Al llegar a esta fase, el primer
paso que debe realizar el diseñador es definir los ítems de información que son
parte del dominio del problema. Debe identificar también, cómo son organizados
los ítems de acuerdo con el perfil del usuario y su tarea; decidir qué interfaz
debería ver y cómo debería comportarse. A fin de implementar todo en un entorno
web, el diseñador debe decidir además qué información debe ser almacenada.

3. UML-Based Web.Se trata de un método que hace uso de técnicas procedentes de la

orientación a objetos para especificar aplicaciones hipermedia. UWE plantea un enfoque
iterativo y progresivo cuyas actividades fundamentales son el análisis de requisitos y el
diseño conceptual, de la navegación y de la presentación. Los elementos hipermedia se
representan por medio de elementos propios de los diagramas de clases UML. Así por
ejemplo, los nodos son clases, los enlaces son asociaciones estereotipadas y las ayudas
a la navegación (como índices o mapas) son clases estereotipadas. Para modelar
aspectos dinámicos se hace uso de modelos de tarea y diagramas de estado, mientras la
navegación y la presentación se representan por medio de UML y de estereotipos creados
al efecto. Los principales aspectos en los que se fundamenta UWE son los siguientes:
Uso de una notación estándar, para todos los modelos (UML: Lenguaje de
modelado unificado).
Definición de métodos: Definición de los pasos para la construcción de los
diferentes modelos.
Especificación de Restricciones: Se recomienda el uso de restricciones escritas
(OCL: Lenguaje de restricciones de objetos) para aumentar la exactitud de los
modelos.

Este proceso de autoría está dividido en cuatro pasos o actividades:

Análisis de Requisitos: Fija los requisitos funcionales de la aplicación Web para

reflejarlos en un modelo de casos de uso. Esto da lugar a los diagramas de casos
de uso.

10
 Diseño Conceptual: Se construye el modelo conceptual del dominio de la
aplicación considerando los requisitos reflejados en los casos de uso. El resultado
es el diagrama de clases de dominio.
Diseño Navegacional: Se obtienen el modelo de espacio de navegación y el de
estructura de navegación, que muestra como navegar a través del espacio de
navegación. El resultado son diagramas de clases que representan estos modelos.
Diseño de Presentación: Representa las vistas del interfaz del usuario mediante
modelos estándares de interacción UML.

Ejemplo de la metodología UWE.- Este es un ejemplo típico de Altas, Bajas y Cambios de Clientes
en un sistema, estos son los cuatro pasos de este ejemplo:
1. Análisis de requisitos. En este ejemplo los casos de uso son los siguientes:
Autenticación. El administrador se autenticará, con su usuario y contraseña, para
acceder al sistema de información. A través de esta autenticación le será mostrada la
información relativa a los clientes.
Alta de clientes. El administrador es el encargado de dar de alta en el sistema a los
clientes. Es el primer paso que hay que realizar para tener a los clientes dentro el
sistema.
Búsqueda de clientes. El administrador puede buscar los datos de los clientes del
sistema para su mantenimiento.
Baja/Modificación de clientes. En caso de que el cliente sufra cualquier cambio en sus
datos, el administrador se encarga de llevar a cabo dichas modificaciones o dar de
baja a los clientes.

2. El diseño conceptual se basa en el análisis de requisitos, es decir, en los casos de uso

anteriores. Con los actores, operaciones y relaciones definidas en el análisis de requisitos
construimos el modelo conceptual, que se representa gráficamente usando UML por
clases, asociaciones y paquetes. En este ejemplo un cliente puede estar asociado a un
usuario.

Usuario

Cliente

3. El modelo de navegación no sólo es útil para comprender mejor la estructura de la

aplicación sino que también permite mejorar la estructura de navegabilidad. Primero se
determinan las clases que pueden ser visitadas a través de la aplicación web. A esto se le
llama espacio de navegación. Las clases del modelo navegacional son las siguientes:
Clase Usuario.- Esta es la clase que atiende las peticiones para el acceso a las
funciones del usuario. Esta clase nos permitirá hacer la autenticación de los usuarios

11
 que quieran utilizar la aplicación y también permitirá realizar la modificación de la
clave de acceso.
Clase Cliente.- Esta clase atiende las peticiones para el acceso a las funciones del
cliente. Esta clase nos permitirá hacer el alta, baja, modificación y búsqueda de un
cliente.

El modelo de navegación además de especificar las clases que podrán ser visitadas por el
usuario, define cómo se alcanzan dichas clases mediante lo que se denomina estructura
de navegación.

Usuario

Menu

Alta Cliente
Búsqueda Cliente

Consulta ? Indice

Indice

Cliente

En la estructura de navegación intervienen aparte de las dos clases, tres elementos más,
que son índices, consultas y menús, a los cuales se les llama elementos de acceso. Un
índice permite el acceso directo a las instancias de una clase de navegación, mientras que
Una consulta representa una búsqueda en función de unos parámetros como la búsqueda
de cliente.

Los Diagramas de navegación se utilizan para comprender mejor la estructura de

pantallas del sistema. Una pantalla, tal como la ve el usuario, se representa como un
estado. Las transiciones pueden ser debidas a enlaces (se representan mediante flechas
discontinuas y etiquetadas) o pueden ser automáticas (se representan mediante flechas
no etiquetadas).

12
 Logout

Inicial
Captura Alta
login Datos
Error

Criterios Lista Detalles Baja

Clientes Clientes

Error búsqueda
login Modificar

Error

4. El modelo de presentación consiste en un conjunto de vistas que muestran el contenido y

la estructura de las clases y como el usuario puede interactuar con ellos. El flujo de
presentación consiste en modelar la fase de presentación mostrando dónde se
presentarán al usuario los objetos de navegación y los elementos de acceso, por ejemplo
dónde se muestra el contenido y qué contenido será reemplazado cuando se accione un
enlace. El flujo de presentación se visualiza con modelos de interacción UML (diagramas
de secuencia). El modelo de flujo de presentación se basa en los casos de uso. Podemos
describir las interacciones entre las capas cuando el administrador se autentica, caso de
uso AUTENTICACIÓN

13
 Administrador Vista Usuario SQL
Petición Entrada
Solicitud Login-Password

Login-Password Crear Usuario

Devolver Control
Autentica Usuario
Crear SQL

Devolver Control
Comprobación log-pass
Comprobación valida
Autenticación
Correcta
Destruir SQL

Entrada Sistema Destruir Usuario

1. Petición entrada: El administrador escribe la URL en el navegador.

2. Solicitud login-password: Se pide un par usuario-contraseña para permitir el acceso al sistema.
3. Login-password: El administrador proporciona su usuario y contraseña como petición de entrada
al sistema.
4. Crear usuario: En el controlador se crea una instancia de la clase usuario.
5. Devolver control: Se devuelve a la vista la instancia de usuario para que se llame al método
correspondiente.
6. Autentica usuario: Se llama al método de la clase usuario que valida al usuario en la BD.
7. Crear sql: Se crea una instancia de la clase sql, encargada de resolver las peticiones a la BD.
8. Devolver control: Se devuelve a la clase usuario la instancia de sql para que se llame a los
métodos de dicha clase que resuelvan la autenticación.
9. Comprobación login-password: Se llama al método de sql correspondiente, para que pida a la
BD la comprobación de si existe el usuario y si se corresponde su contraseña.
10. Comprobación válida: La BD, a través del sql, devuelve al usuario el resultado de la petición, en
nuestro diagrama sería resultado correcto.
11. Destruir sql: Destruimos la instancia de la clase creada para la autenticación.
12. Autenticación correcta: Usuario devuelve a la capa de vista el resultado de la petición.
13. Destruir usuario: Destruimos la instancia de la clase usuario creada.
14. Entrada Sistema: Se muestra al administrador en el navegador las opciones que puede realizar
dentro del sistema. Si el resultado fuese de autenticación incorrecta, en el navegador web, seguiría
estando la petición de login y password y no le permitiría entrar en el sistema.

14
2.6 Aspectos de seguridad.
Debido a los pocos mecanismos de seguridad informática en Internet, el hecho de colocar una
página Web en ella trae determinados riesgos que pueden ser controlados con alguna estrategia
adecuada.

La seguridad en una página debe cumplir con tres aspectos: operatividad, integridad y privacidad,
al igual que cualquier otro dispositivo de cómputo.

1. Operatividad: La información que contenga la página debe estar siempre en condiciones

operativas para quienes acceden a la misma puedan recorrerla sin problemas, sin
encontrar fallas, faltas, o cualquier tipo de anomalía.Hay que considerar también que el
ingreso de un intruso al sistema puede provocar daños que afecten a la operatividad.
2. Integridad: De nada sirve que una información esté en condiciones operativas si es
incompleta o está alterada. Para que una información resulte inútil no es necesario que
sea destruida, puede ser suficiente una acción tan sutil como cambiar los unos por ceros.
Por lo tanto la integridad de la información que se muestra en una página Web es uno de
los factores más importantes de la seguridad, pues de él dependen el interés y la
credibilidad de la página. La integridad de la página puede ser dañada por fallas de
hardware o software, o atacada por intrusos en el sistema que toman el control sobre
algún sector y modifican el contenido de las páginas
3. Privacidad: Es lógico pensar que quien quiere que una información sea privada no debe
colocarla en una página Web. Pero puede ocurrir que parte de la información esté
reservada a usuarios registrados o que exista algún tipo de restricción.

Cada una de las condiciones de seguridad de una página Web: operatividad, integridad y
privacidad, tienen sus propios riesgos que actúan dentro o fuera del sistema.

Para establecer una estrategia de seguridad se debe evaluar el grado de importancia de cada uno
de ellos y basándose en ello, establecer normas y procedimientos necesarios para contenerlos:

Para muchas aplicaciones de negocios, como la publicidad y promociones simples, es probable

que no se necesite tratar con precauciones de seguridad. Pero si se permite que los usuarios
tengan acceso a datos delicados, se deberán tomar medidas para proteger a los datos. Debido a
que cada vez son más las personas que desean transferir documentos e información de tarjetas
de crédito o cualquier tipo de transmisión de datos en forma segura y sin el temor a los crackers
y piratas.

Las medidas de seguridad básicas a tener en cuenta son:

1. La encriptación de Datos: Es una técnica para ocultar datos de manera que sólo puedan
ser vistos por aquellos que deben verlos. Consiste en reemplazar un mensaje enviado con
un algoritmo difícil de adivinar. Los servidores seguros tratan de encriptar los datos entre el
navegador y el servidor. En algún momento durante el ciclo de compras, después que los
datos llegan al servidor seguro, el sistema debe desencriptar los datos. Aun si los datos
son desencriptados sólo por un instante, la información podría ser interceptada por algún
pirata. Crear un sistema en el que la información permanezca encriptada a lo largo del ciclo
es prácticamente imposible. La configuración más segura es una que transmita la
información al propietario de la empresa en formato encriptado, pase la información a una
computadora que no esté en Internet y luego desencripte la información. Además si en una
empresa se utiliza un mismo algoritmo para encriptar y desencripar datos, se necesitará
que alguna tercera pieza de datos desencripte el código, que seria una clave. Esto sólo
funcionará si tanto la persona transmisora como la parte receptora conocen la clave. Si la
persona receptora no conoce la clave, tiene que enviar la clave a esa parte, y está puede
ser interceptada.
2. Firma Digital: Ofrece un método de encriptación de datos que evita tener que compartir
claves para leer mensajes. Es la técnica llamada encriptación de clave pública, donde

15
 cada usuario tiene dos claves: una clave pública y una clave privada. Los algoritmos de
encriptación y desencriptación son adaptados de manera que sólo la clave pública puede
desencriptar los datos encriptados por la clave privada. Por consiguiente, puede transmitir
con libertad la clave pública al mundo.
3. Creación de un Sitio Seguro: Las ventajas de crear un sistema seguro antes de ser
pirateado deben ser obvias. La prevención es la mejor medicina y esto se aplica también
ala seguridad de las computadoras. Se debe mantener la seguridad de los archivos de
datos de tal forma que solo las personas correctas puedan verlos. Esto es crucial para los
siguientes tipos de datos y archivos: contraseñas de usuarios, archivos de facturación,
registros de sistema y de usuarios, información de tarjetas de créditos, información
confinada de sistemas remotos, compiladores, herramientas de administración.
4. Firewalls, Wrappers y Proxies: Los firewalls, wrappers y proxies ofrecen una buena línea
de defensa para los propietarios de servidores Web y administradores de sistemas. Los
firewalls pueden ser software o hardware que protege los puertos y evita que los piratas
penetren al sistema. Los firewalls permiten que tengan acceso al sistema sólo ciertos
nombres de dominio confiables. Los wrappers se encuentran disponibles en CERT al igual
que en otros archivos en Internet. Los wrappers se ejecutan como una capa de software
alrededor de su otro software. Un usuario que se conecta a FTP primero entraría en
contacto con el wrapper, el cual luego habilitaría al FTP. El usuario no sabe que existe el
wrapper y no puede detectar ninguna diferencia en el sistema. Los wrappers son
interesantes porque son flexibles. Pueden actuar como firewalls y en realidad pueden
rechazar usuarios con base en sus nombres de usuarios al igual que en sus nombres de
dominios. Además permite crear callejones sin salida que permiten atrapar piratas. El
modo proxy es un método permite ocultar datos por medio de reenrutamiento de las
solicitudes. Es útil para usuarios que están detrás de una firewall. Los usuarios establecen
una dirección proxy de su navegador para que apunte hacia su servidor Web. El servidor
Web maneja entonces la dirección real de los datos hacia el mundo exterior. Esto reduce la
dirección que el usuario está tomando cuando deja su sistema, permitiéndole al usuario
enrutar los datos los datos a través de los agujeros en sus propias firewalls. La otra ventaja
es que las solicitudes pueden ser filtradas por el software del servidor. Al filtrar la
información, puede restringir el contenido y rastrear el uso al igual que modificar la
información en ese instante. Los servidores proxy también pueden ser dirigidos a otros
servidores proxy, lo cual les permite ocultar datos en forma efectiva. Otra ventaja de los
servidores proxy es que los servicios como FTP, Telnet, Gopher, NetnNews, etc., pueden
ser erutados a servidores diferentes. Esto le permite distribuir diversas cargas de servidor
Web a diferentes servidores físicos. Además de beneficiarse con el ocultamiento de los
datos, ser reduce la carga del servidor.

Algunas de las definiciones más importantes en el manejo de la seguridad son las siguientes:
Clave pública: Es una clave alfanumérica creada por medio de algoritmos matemáticos que
sirve para encriptar una serie de datos. Suele ser creada junto con una clave privada, la
clave pública se suele llamar también llave pública.
Clave privada: Es una clave alfanumérica creada por medio de algoritmos matemáticos
que sirve para desencriptar una serie de datos que han sido creados por la clave pública
que forma la pareja.
Certificado: Es la certificación electrónica que vincula unos datos de verificación de firma a
un signatario y confirma su identidad
Autoridad certificadora: Es la autoridad que garantiza que una firma es de quien dice ser,
esta garantía se da por medio de certificados digitales.
Prestador de servicios de Certificación: Es una empresa o entidad que expide certificados
digitales, puede ser una autoridad de certificación o expedirlos en nombre de ésta

16
Los certificados digitales son expedidos por una autoridad de certificación (CA) y contienen entre
otros datos el nombre de la empresa, un numero serial, fecha de expiración y una llave publica que
permite encriptar la información.
La empresa que desee encriptar información debe solicitar un certificado digital a una autoridad de
certificación (CA). La CA emite un archivo con un certificado digital que contiene la llave pública así
como otros datos.
El uso mas común para los certificados digitales es verificar que un sitio en internet es quien en
realidad dice ser, y proveer transferencia encriptada de datos. El usuario que recibe la información
encriptada utiliza la llave pública que ofrece la CA para decodificar el certificado digital. Se verifica
que el certificado es autentico y que fue en realidad emitido por la CA y una vez entonces
identificado obtiene la llave publica del sitio.
Un uso práctico de ello se da en los bancos por Internet, los que utilizan sitios seguros para
identificar a sus usuarios y ofrecer servicios con seguridad y prevenir delitos informáticos.

Vemos aquí un ejemplo para entender el funcionamiento de la encriptación:

Cuando el usuario A quiere mandar un mensaje al usuario B sin que alguien pueda entender el
contenido del mensaje, incluso si éste fuese interceptado por una tercera persona. Para ello el
usuario B dispone de dos llaves, una es la llave pública y otra la llave privada, la pública, la puede
poseer todo el mundo puesto que sólo puede encriptar es decir cifrar o cerrar.
La llave pública tiene una hermana que es la privada, que sirve para abrir y por lo tanto está
únicamente en posesión del usuario B, quien manda a llave pública al usuario A, en el camino
cualquiera puede haberla copiado, pero no importa puesto que esa llave solamente cierra o
encripta, esta llave es utilizada para cifrar o cerrar el mensaje, que se envía. Cuando el mensaje
llega al usuario B, éste utiliza su llave privada, que sólo el conoce y abre el mensaje.

Este sistema parece en si seguro, pero tiene un problema, imaginemos que el usuario A manda
todas las semanas dinero al usuario B, un hacker ser percata de ello y trama el siguiente plan:
Crea dos llaves, privada y pública y manda la pública al usuario A diciéndole que le mande mas
dinero esa semana, entonces el usuario A envía los datos del banco por correo y los cifra con la
supuesta llave pública. El dinero acabaría en manos del hacker, puesto que sólo él dispone de la
llave para desencriptar los datos del banco.
El problema aquí es que el hacker se ha hecho pasar por el usuario B. aparece entonces la
necesidad de crear una tercera entidad en la transacción: Autoridad de Certificación.
El certificador, es una entidad o persona en la que tanto el usuario A como el usuario B confían,
por lo que certifica al usuario A que la llave pública que le llega a éste es del usuario B y no del
hacker.

La comunicación segura se realiza de la siguiente manera:

1. El usuario B crea dos llaves, una privada y otra pública, la pública se la entrega a la
entidad de certificación en la que el confía.
2. La entidad de certificación, es una entidad seria que se ha registrado, en el registro de
prestadores de certificación del ministerio de justicia, y verifica eficientemente
(presencialmente, por correo certificado ordinario etc.) que la llave pública que le están
entregando es del usuario B y no del hacker. Hasta aquí todo va bien, tenemos la certeza
de que la llave pública es del usuario B por lo tanto la autoridad certificadora le entrega un
certificado. Este certificado contiene:
Identificador del propietario
Identificador de la autoridad que firma el certificado
Período de validez
Identificación del certificado
Clave pública del usuario
Firma de la autoridad
3. El usuario B manda el certificado junto con la llave pública al usuario A, para que este le
mande dinero. El usuario A lee el certificado y llama a la Autoridad certificadora, la cual le
garantiza que la llave es del usuario B.
4. El usuario A con total seguridad encripta los datos bancarios y se los manda al usuario B.

17
 5. En el camino el haker, intercepta el mensaje, el posee la llave pública, pero como no posee
la privada que sólo el usuario B posee, no le sirve de nada el mensaje interceptado, puesto
que no puede descifrar, los datos bancarios.
6. El mensaje llega al usuario B que abre o desencripta el mensaje con la seguriidad de que
nadie lo ha abierto.

Otra utilidad de la firma digital además de la de encriptar los mensajes es la verificación de la

autenticidad de la identidad de la persona que firma un documento. Como vemos en el siguiente
ejemplo:
El usuario B utilizando su llave privada, firma el documento que quiere enviar al usuario A, éste
recibe el documento firmado, y utilizando la llave pública del usuario B, verifica la firma del primero.
Esta es una situación similar a la de la encriptación, imaginemos que un hacker crea dos llaves,
una pública y otra privada, le hace llegar la pública al usuario A y seguidamente le manda un
documento firmado con la supuesta llave privada del usuario B pidiéndole dinero. El usuario A en
posesión de la supuesta llave pública del usuario B, verifica que es el, cuando en su lugar es el
hacker. Aparece la necesidad de una tercera entidad como en el caso de la encriptación, que
certifique la autenticidad de dicha firma: esta es llamada Autoridad de Certificación.

Un ejemplo comercial de la utilización de certificados es el SSL o Secure socket Layer que se basa
en la utilización de certificados y que garantiza al día de hoy, si se realiza correctamente el
comercio electrónico en Internet, este protocolo funciona como en el siguiente ejemplo:
Un negocio que vende sus productos por Internet, antes de comenzar a vender, crea un par de
llaves una pública y otra privada y solicita un certificado a una autoridad de certificación de manera
que no halla dudas de que la llave pública es de esa empresa, esta llave pública sólo sirve para
encriptar, y cualquier persona puede estar en posesión de ella, de hecho cada vez que un usuario
quiere hacer una compra por primera vez, debe haber descargado el certificado con la llave pública
de la empresa.
Estos serían los pasos a seguir para realizar una compra por Internet:
Paso 1: Un usuario quiere comprar un producto por Internet, para ello pondrá la dirección en su
programa navegador, por ejemplo http://www.musica-online.com el navegador conectará y pondrá
https://www.musica-online.com en vez de:
http://www.musica-online.com
Hay que darse cuenta que ha puesto https en vez de hhtp la s significa que estamos en un sitio
seguro.

Paso 2: Pero como es la primera vez que nos conectamos, el navegador nos dará un mensaje,
informándonos que no confiamos en esa empresa, puesto que no tenemos ningún certificado que
la acredite, seguramente en la propia página web encontraremos algún vínculo donde descargar el
certificado. Aparecerá una pantalla donde podamos leer el certificado, y nos pedirá si confiamos en
el y si queremos instalarlo. Si el certificado es de nuestra garantía; es decir conocemos la autoridad
certificadora, por ejemplo nuestro Banco o Caja de ahorros entonces lo instalaremos.

Paso 3: Ya tenemos la llave pública de la empresa, podemos mandarle información confidencial

como por ejemplo nuestro numero de tarjeta. Pero el servidor de la empresa no puede mandarnos
información confidencial a nosotros puesto que no tiene nuestra llave pública ni algún certificado
que asegure que nosotros somos quien decimos ser, por lo que nuestro navegador genera dos
pares de llaves una pública y otra privada.

Paso 4: Nuestro navegador, utilizando la llave pública de la empresa, que sólo sirve para encriptar,
es decir para cerrar, manda encriptada la llave pública que ha generado aleatoriamente nuestro
navegador, puesto que es pública se podría haber mandado sin encriptar, pero aún asi este
proceso mejora la intimidad y la manda encriptada.

Paso 5: A la empresa le llega la llave pública generada para esa transacción, puesto que ambas
partes tienen la llave pública del otro, pueden establecer un canal. El usuario mandará los datos de
su tarjeta y verá en pantalla un recibo que podrá imprimir y utilizar en caso de reclamación. La

18
empresa por su parte tendrá que comprobar los datos de la tarjeta por otro sistema, puesto que
nadie le asegura a la empresa que el que compra es quien dice ser.

19