1.

2 Arquitectura de las aplicaciones Web 1

Investigación 03:

Arquitectura de las aplicaciones Web

Canseco Reyes Elizabeth

Tecnológico Nacional de México, Campus Pinotepa.

Ingeniería en Sistemas Computacionales.
Administración de Bases de Datos.
Santiago Pinotepa Nacional, Oax., Méx.
28 de Agosto de 2022.
 1.2 Arquitectura de las aplicaciones Web 2

Investigación 03:

Arquitectura de las aplicaciones Web

Canseco Reyes Elizabeth

M. Sc. Jesús Hernández Sánchez

Tecnológico Nacional de México, Campus Pinotepa.

Ingeniería en Sistemas Computacionales.
Administración de Bases de Datos.
Santiago Pinotepa Nacional, Oax., Méx.
28 de Agosto de 2022.
 1.2 Arquitectura de las aplicaciones Web 3

¿Qué es la arquitectura Web?

La arquitectura Web es la planificación y el diseño de los componentes técnicos, funcionales y

visuales de un sitio web, antes de que sea diseñado, desarrollado e implementado. Los
diseñadores y desarrolladores la utilizan como un medio para ejecutar su trabajo.

Por lo tanto, se trata de la estructura conceptual de la World Wide Web —WWW—. La WWW
o Internet es un medio en constante cambio que permite la comunicación entre diferentes
usuarios y la interacción técnica (interoperabilidad) entre distintos sistemas y subsistemas.

La base para esto son los diferentes componentes y formatos de datos, que generalmente se
organizan en niveles y se construyen unos sobre otros.

Esta infraestructura del Internet también es posible gracias a los tres componentes centrales de
los protocolos de transmisión de datos (TCP/IP, HTTP, HTTPS), los formatos de representación
(HTML, CSS, XML) y los estándares de direccionamiento (URI, URL).

Componentes de una aplicación Web

El Patrón de aplicación web contiene componentes que representan servicios de middleware

necesarios para la instancia de aplicación virtual.

Puede conectar componentes en un patrón de aplicación virtual para indicar dependencias y,

opcionalmente, aplicar una política para configurar servicios de middleware durante el
despliegue con el fin de configurar un comportamiento específico o definir un nivel de calidad
de servicio. Los componentes, enlaces y políticas pueden tener atributos necesarios y atributos
opcionales.

Los componentes, enlaces y políticas está definidos por plugins. Cuando se crea un patrón de
aplicación virtual, los plugins incluidos en el tipo de patrón seleccionado determinan los
componentes, enlaces, políticas y opciones de configuración disponibles.

Los componentes siguientes están disponibles con el Patrón de aplicación web.

Aplicación
 1.2 Arquitectura de las aplicaciones Web 4

 Archivo de archivado adicional (Aplicación web)

 Archivo de archivado adicional (aplicación Java™)
 Componente de aplicación de empresa
 Punto final de proveedor de servicio web existente
 Aplicación Java (IBM Java Runtime Versión 7) (aplicación Java)
 Conjunto de políticas
 Componente de aplicación web

Base de datos

 Consola web de Database Studio

 Base de datos (DB2), como por ejemplo IBM® DB2
 Base de datos existente (DB2)
 Base de datos existente (Informix)
 Base de datos existente (Oracle)
 Base de datos IMS existente

Mensajería

 Servicio de mensajería existente (WebSphere MQ)

 Tema
 Cola

OSGi

 Repositorio de paquetes OSGi existente (WebSphere Application Server)

 Aplicación OSGi (WebSphere Application Server)

Proceso de transacción

 CICS Transaction Manager existente

 IMS Transaction Manager existente

Registro de usuario
 1.2 Arquitectura de las aplicaciones Web 5

 Registro de usuarios existente (IBM Tivoli Directory Server)

 Registro de usuario existente (Microsoft Active Directory)
 Registro de usuarios (Tivoli Directory Server)

Otros componentes

 Conexión de salida
 Conexión de entrada
 "Conexión de entrada" (en desuso) (aplicación Java)
 "Conexión de salida" (en desuso) (aplicación Java)
 Archivo supervisado (aplicación Java)
 Escucha HTTP (aplicación Java)

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.
 1.2 Arquitectura de las aplicaciones Web 6

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.

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.

Las colecciones 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:
 1.2 Arquitectura de las aplicaciones Web 7

 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.

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.
 1.2 Arquitectura de las aplicaciones Web 8

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

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:

 1.2 Arquitectura de las aplicaciones Web 9

 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
 1.2 Arquitectura de las aplicaciones Web 10

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 el
os 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 vez se compone de diversos subproyectos entre los cuales esta el Eclipse Web
Tools Platform (WTP), el cual contiene herramientas para el desarrol o de aplicaciones
web, que incluyen editores gráficos para simplificar el desarrollo.

Políticas

Si lo prefiere, puede aplicar políticas a una aplicación virtual para configurar un

comportamiento específico en la instancia de aplicación virtual desplegada. Dos aplicaciones
virtuales pueden incluir dos componentes idénticos, pero requieren políticas distintas para lograr
diferentes acuerdos de nivel de servicio. Por ejemplo, si desea que una aplicación web tenga
una disponibilidad muy alta, puede añadir una política de escalado al componente de aplicación
web y especificar requisitos como, por ejemplo, un umbral de uso de procesador para
desencadenar el escalado de la aplicación web. En tiempo de despliegue, la topología de la
aplicación virtual está configurada para que realice el escalado de la aplicación web de forma
dinámica. Inicialmente se despliegan varias instancias de WebSphere Application Server para
la aplicación web, y se añaden y eliminan automáticamente según los niveles de servicio
definidos en la política.
 1.2 Arquitectura de las aplicaciones Web 11

Las políticas sólo se pueden aplicar a determinados tipos de componentes. Para obtener más
información, consulte el tema, consulte los enlaces siguientes:

 Política de escalado
 Política de direccionamiento
 Política de registro
 Política de JVM (aplicación web)
 Política de JVM (aplicación Java)
 Política del arreglo temporal
 Política de direccionamiento (aplicación Java)
 Política de escalado (aplicación Java)
 1.2 Arquitectura de las aplicaciones Web 12

Referencias

 2.1 Arquitectura de las aplicaciones Web. (2022). Retrieved 28 August 2022, from
https://programacionwebisc.wordpress.com/2-1-arquitectura-de-las-aplicaciones-web/
 (2022). Retrieved 28 August 2022, from https://nagaaralive0012rh.wixsite.com/mi-
pagina-web/12-arquitectura-de-las-aplicaciones-
web#:~:text=Las%20aplicaciones%20Web%20est%C3%A1n%20basadas,informaci%
C3%B3n%20a%20los%20servidores%20Web.
 Souza, I., & Souza, I. (2022). Arquitectura web: ¿qué es y cómo estructurar la de tu
página?. Retrieved 28 August 2022, from https://rockcontent.com/es/blog/arquitectura-
web/#:~:text=La%20arquitectura%20web%20es%20la,medio%20para%20ejecutar%2
0su%20trabajo.
 IBM Documentation. (2022). Retrieved 28 August 2022, from
https://www.ibm.com/docs/es/psww2500/2.3.1.0?topic=SSCR9A_2.3.1.0/doc/iwd/apc
_cloudparts.html
 2.4 Ambientes para el desarrollo de aplicaciones Web. (2022). Retrieved 28 August
2022, from https://programacionwebisc.wordpress.com/2-4-ambientes-para-el-
desarrollo-de-aplicaciones-
web/#:~:text=Un%20ambiente%20de%20desarrollo%20para,la%20creaci%C3%B3n
%20de%20aplicaciones%20web.