MODELOS DE DESARROLLO WEB
1.1 INTERNET Y WEB
BENEMÉRITA UNIVERSIDAD AUTÓNOMA DE PUEBLA
FACULTAD DE CIENCIAS DE LA COMPUTACIÓN
Dr. Mario Anzures García
PRIMAVERA 2021
INTRODUCCIÓN
Una Aplicación Web es un software compuesto por un conjunto de páginas Web que
permiten resolver un problema específico.
Es una plataforma, principalmente, interactiva que se centra en que los usuarios
realicen acciones o tareas desde un navegador
Un navegador es el software que permite visualizar una página Web.
INTRODUCCIÓN
Una página Web es un documento que presenta información (contenido) en una forma
estructurada (organizada) con cierto formato, permitiendo la interacción con los
usuarios y entre éstos a través de un navegador; visualizado por medio de Internet.
Una Web app es una versión de la página web optimizada y adaptable a cualquier
dispositivo móvil; que se puede abrir desde el navegador de cualquier
terminal independientemente del dispositivo que utilice.
INTRODUCCIÓN
Un sitio Web es un conjunto de varias Web interconectadas, cuyo objetivo principal
es entregar información.
Además, la tarea más importante para los usuarios es consumir contenidos en un
sitio Web.
Por tanto, un sitio Web requiere de un gestor de contenidos.
INTRODUCCIÓN
Las aplicaciones Web se centran en la realización de acciones, mientras que los sitios
Web son fuentes de información.
Un aplicación Web puede ser parte de un sitio Web en un proyecto, pero no al revés.
Las funciones y tareas de una aplicación Web son más y tienen un nivel de complejidad
más elevado.
WEB E INTERNET
Web (World Wide Web, o www), es un conjunto de documentos interconectados por
enlaces de hipertexto (textos, gráficos y archivos de todo tipo, en un mismo
documento), disponibles en Internet.
La Web fue creada en 1989 por Tim Berners-Lee, informático de la Organización
Europea de Investigación Nuclear (CERN), como herramienta de comunicación entre
los científicos.
La WWW ha evolucionado desde sus inicios (Web 1.0) hasta nuestros días, abriendo
un abanico de posibilidades a los usuarios.
WEB E INTERNET
Web. Fuente [radar 2007]
WEB E INTERNET
La Web está conformada por todos los sitios o aplicaciones existentes en el mundo,
los cuales se implementan sobre el Internet.
El Internet es la infraestructura construida sobre una red de computadoras
comunicándose a través de un conjunto de protocolos que lo permiten.
INTERNET
Enlaces de comunicación:
Tráfico.
Tasa de transmisión = ancho de banda
Fibra, cobre, radio, satélite.
Procesos, programas ejecutados en un host.
Comunicación inter-procesos. Cuando dos procesos se comunicanen un mismo host, dicha comunicación es definida por el sistemaoperativo.
Comunicación entre procesos. Cuando dos procesos en diferenteshosts se comunican, utilizando intercambio de mensajes.
Proceso del cliente. Proceso que inicia la comunicación
Proceso del servidor. Proceso que espera ser contactado.
Reporte 2019, SANDVINE
INTERNET
Reporte 2019, SANDVINE
INTERNET
Red. Conjunto de equipos, nodos y software conectados por medio de dispositivos,
que envían y reciben impulsos o cualquier otro medio para el transporte de datos, el
objetivo de compartir información y recursos entre procesos, así como de ofrecer
servicios.
Hosts. Computadoras o dispositivos que proporcionan servicios a la red a la que
están conectados.
Routers. Permite interconectar computadoras que funcionan en una red, ya que se
encarga de establecer la ruta que destinará a cada paquete de datos.
INTERNET
Puertos. Un puerto se numera, para identificar la aplicación que lo usa y de esta
forma, decidir a qué programa entregará los datos recibidos.
La asignación de puertos se realiza a través de IANA (Internet Assigned Numbers Authority) y
permite a una computadora o dispositivo establecer simultáneamente diversas conexiones
con otros dispositivos distintos.
Así cada segmento que se recibe tienen la misma dirección, pero van dirigidos a puertos
diferentes
INTERNET
Puertos. Un puerto se numera, para identificar
la aplicación que lo usa y de esta forma, decidir a
qué programa entregará los datos recibidos.
La asignación de puertos se realiza a través de IANA
(Internet Assigned Numbers Authority) y permite a una
computadora o dispositivo establecer simultáneamente
diversas conexiones con otros dispositivos distintos.
Así cada segmento que se recibe tienen la misma
dirección, pero van dirigidos a puertos diferentes
INTERNET Ejemplos de Puertos.
FTP de datos 20
Control de FTP 21
SSH 22
Telnet 23
SMTP 25
Domain Name Server 42
Whois 43
HTTP 80
POP3 110
IMAP4 143
BGP 179
HTTPS 443
IMAP4 sobre SSL 993
INTERNET
Arquitectura de Red: Modelo Cliente –
Servidor.
Servidor. Computadora que contiene la
información, siempre debe estar encendida y tener
un dirección IP (Internet Protocol) fija.
Clientes. Se comunica sólo con el servidor, pueden
conectarse intermitentemente y tener direcciones IP
dinámicas.
Debilidades. Caída del servidor, cuellos de botella y
latencia.
03
Cliente 1
Cliente 2
Cliente 3
Cliente n
Servidorpetición
petición
petición
peticiónCOMUNICACIÓN
SÍNCRONA
petición
Cliente 1
Cliente 2
Cliente 3
Cliente n
Servidor
petición
petición COMUNICACIÓN
ASÍNCRONA
petición
INTERNET
Arquitectura de Red: Modelo Peer-to-Peer.
En este modelo todas las computadoras o
dispositivos conectados a la red son iguales o
pares (Peer).
Éstos puede ser cliente y servidor al mismo
tiempo, por tanto, se comunican directamente,
conectan intermitentemente y cambian sus
direcciones IP.
Es Altamente escalable, robusto (ningún nodo es
imprescindible) y los costos se distribuyen entre
los usuarios.
Pero es complicado de administrar.
03
Cliente /
Servidor
Cliente /
Servidor
Cliente /
Servidor
Cliente /
Servidor
Cliente /
Servidor
Cliente /
Servidor
respuesta /
petición
respuesta /
petición
respuesta /
petición
respuesta /
petición
respuesta /
petición
respuesta /
petición
INTERNET
Arquitectura de Red: Modelo Peer-to-Peer.
Redes P2P centralizadas. Un único servidor para realizar as transacciones entre losnodos de la red, almacenar y distribuir los nodos donde se guardan los contenidos. EjemploNapster.
Redes P2P híbridas. Semicentralizadas o mixtas, uno o varios servidores sirven comohub, para administrar los recursos de banda ancha, enrutamientos y comunicación entrenodos pero sin saber la identidad de cada nodo y sin almacenar información alguna.Ejemplos BitTorrent, eDonkey
Redes P2P puras o descentralizadas. Todas las comunicaciones son directamente deusuario a usuario, Ejemplos: Kademlia,Ares Galaxy, Gnutella, Freenet
INTERNET
Protocolos. Conjunto de reglas que permite la comunicación entre procesos,
especificando:.
Tipo y orden de los mensajes a ser intercambiados
Formato de datos en los mensajes
pares de módulos para enviar y recibir mensajes.
Agrupados en capas, similar al esquema de protocolos OSI, sólo que simplificados.
INTERNET
Capas.: La capa de interfaz de red – red física
La capa de internet – ruteo, control, validación de
mensajes, interpretación de encabezados.
La capa de transporte – servicios de transporte de
mensajes usando TCP o UDP
La capa de aplicación – servicios de internet (HTTP,
FTP, SMTP, etc)
INTERNET
Protocolos de Internet – Nivel de acceso físico
Ethernet: LAN con topología de bus o estrella, actualmente Gigabit Ethernet: 10GBASE-R/LR/SR
(long range, short range, etc.).
DSL (Digital subscribe line). Línea telefónica tradicional, que evolucionó a ADSL (Asymmetric DSL)
HFC (Hybrid Fiber Coaxial). Red de banda ancha por cable de TV.
FTTH (FiberToThe Home). Fibra óptica.
Wi-Fi (wireless fidelity). IEEE 802.11 .11 (1-2 Mbps); .11a (hasta 54 Mbps); .11b (hasta 11 Mbps); .11g
(más de 54 Mbps), 802.11n: siguiente generación Wi-Fi
WiMAX (Worldwide Interoperability for Microwave Access).Alternativa al cable y al DSL
INTERNET
Protocolos de Internet – Nivel de Internet
Protocolo de Internet (Internet Protocol ,IP). Se encarga del encaminamiento de paquetes
(datagramas) entre nodos de la red.
Protocolo datagrama, no orientado a conexión y no fiable. No hay recuperación de errores,
pero existe comprobación de estos, y los paquetes IP erróneos se rechazan, sin notificar al
emisor; y soporta fragmentación de datos en paquetes IP (<1400 bytes)
INTERNET
Protocolos de Internet – Nivel de Internet
Direcciones IP. Cada máquina (host) tiene una dirección única.
IPv4. 32 bits (4 octetos, entre 0 y 255, separados por .), con 4 clases de direcciones IP: A,B, C (network ID+host ID), como 127.x.x.x se reservan para designar la propia máquina;y presenta dirección IP dinámica asignada mediante un servidor DHCP (Dynamic HostConfiguration Protocol).
IPv6. 128 bits (32 dígitos): 3.4×1038 direcciones, para cada persona se pueden asignarvarios millones de Ips.
Con IPv4 hay hasta 232 = 4.294.967.296 direcciones únicas (realmente son 3.200 a 3.300por las clases que hay definidas)
Solución: Network Address Translation (NAT), RFC 2663 (1999)
INTERNET
Protocolos de Internet – Nivel de Red
NAT Básico.Traduce una IP privada en una pública.
NAPT (Network Address and Port Translation). Un grupo de nodos en una red privada
comparten una IP pública (NATde muchos a uno) y esadecuado para conexiones hacia el
exterior, pero serequiere mantener el estado en el NAPT
NAT estática (port forwarding). Se puede configurar un puerto para uso permanente, es decir,
“abrir un puerto” para que sea accesible desde el exterior.
INTERNET
Protocolos de Internet – Nivel deTransporte
TCP (Transmission Control Protocol). Protocolo orientado a conexión, fiable
(recuperación de errores), y con control de flujo, que define un canal de bytes (byte stream).
UDP (User Datagram Protocol). Protocolo no orientado a conexión y no fiable, por ello,
si se recibe un paquete sin errores se pasa al proceso de usuario destinatario, si no, se
descarta silenciosamente, pero tiene un límite de tamaño de datagrama: 64 KB; también
existe UDP Multicast.
En una red local, UDP es más eficiente y normalmente no hay errores.
A través de Internet es más seguro utilizar TCP.
INTERNET
Protocolos de Internet – Nivel de Aplicación
Servicios de aplicación tradicionales:
Servicios de soporte
DNS:Domain name service protocol
Traducción de nombres en direcciones (funciona sobre UDP y TCP)
SNMP: Simple Network Management Protocol
Gestión de red
INTERNET
Protocolos de Internet – Nivel de Aplicación
Servicios de correo electrónico:
SMTP (Simple Mail Transfer Protocol). Protocolo para transferencia de correos electrónicos entre
servidores de email y de clientes al servidor.
IMAP (Internet Message Access Protocol). Acceder a los mensajes que llegan al servidor de correos
electrónicos.
POP: Post Office Protocol.Recoger mensajes en el servidor de correos electrónicos.
INTERNET
Protocolos de Internet – Nivel de Aplicación
BitTorrent. Compartición de archivos p2p
NTP (Network Time Protocol). Sincronización de tiempo usando UDP
IRC: Internet Relay Chat. Protocolo de comunicación en tiempo real basado en texto, que permite debatesentre dos o más personas
LDAP (Lightweight Directory Access Protocol). Protocolo Ligero de Acceso a Directorios distribuidos en unared IP, que presenta una rganización jerárquica.
NFS (Network file system protocol). Sistema de archivos de red utilizado para sistemas de archivosdistribuido en un entorno de red de computadoras de área local.
NIS (Network information Service, “Yellow Pages”). Sistema de Información de Red es un protocolo deservicios de directorios cliente-servidor, para el envío de datos de configuración en sistemas distribuidostales como nombres de usuarios y hosts entre omputadoras.
NNTP: Network News Transfer Protocol (News)
INTERNET
Protocolos de Internet – Nivel de Aplicación
SSH (Secure Shell). Uso de criptografía de clave pública para transmisión segura de información.
SSL (Secure Socket Layer). Protocolo que encripta la capa de aplicación y transporte empleandocriptografía asimétrica.
Socket. Se refiere a un concepto abstracto por el cual dos procesos pueden intercambiar cualquierflujo de datos, generalmente de manera fiable y ordenada.
RPC (Remote Procedure Call) La llamada a procedimiento remoto permite laa comunicación entreaplicaciones simulando llamadas a procedimientos.
HTTP (HyperTextTransfer Protocol ).Aplicación cliente/servidor que usa TCP para recuperar páginas
HTML. (HyperText Markup Language) Lenguaje basado en etiquetas empleado para esquematizar elcontenido de un documento de hipertexto: <etiqueta> </etiqueta>.
El navegador web funciona como intérprete del documento HTML y lo renderiza (dibuja) en lapantalla de acuerdo a su especificación.
INTERNET
Protocolos de Internet – Nivel de Aplicación
SSH (Secure Shell). Uso de criptografía de clave pública para transmisión segura de información.
SSL (Secure Socket Layer). Protocolo que encripta la capa de aplicación y transporte empleandocriptografía asimétrica.
Socket. Se refiere a un concepto abstracto por el cual dos procesos pueden intercambiar cualquierflujo de datos, generalmente de manera fiable y ordenada.
RPC (Remote Procedure Call) La llamada a procedimiento remoto permite laa comunicación entreaplicaciones simulando llamadas a procedimientos.
HTTP (HyperTextTransfer Protocol ).Aplicación cliente/servidor que usa TCP para recuperar páginas
HTML. (HyperText Markup Language) Lenguaje basado en etiquetas empleado para esquematizar elcontenido de un documento de hipertexto: <etiqueta> </etiqueta>.
El navegador web funciona como intérprete del documento HTML y lo renderiza (dibuja) en lapantalla de acuerdo a su especificación.
INTERNET
HTTP
Se usa para la transmisión de archivos de hipertexto enInternet. Es decir, en cada transacción de la Web.
HTTP define la sintaxis y la semántica que utilizan loselementos software de la arquitectura web (clientes,servidores) para comunicarse.
Es un protocolo orientado a transacciones y sigue el esquemapetición-respuesta entre un cliente y un servidor
Emplea el paradigma request/response (peticion/respuesta).
Emplea mensajes HTTP: Grupo de líneas que contienenencabezados de mensaje, después viene una línea en blanco yposteriormente sigue el cuerpo del mensaje.
Es un protocolo stateless (sin estado). El servidor no recuerdalas peticiones anteriores realizadas por los clientes.
INTERNET
• Estructura de la Petición HTTP
INTERNET
• Estructura de la Respuesta HTTP
INTERNET
Métodos de la Petición HTTP
Comunes
SSH (Secure Shell). Uso de criptografía de clave pública para transmisión segura de información.
Get
Head
Post
No tan comunes
Put
Delete
Trace
Options
Connect
INTERNET
Método GET
Se ejecuta al dar clic en un hipervínculo, visualizar una imagen o acceder un enlace en la barra de
navegación
INTERNET
Método POST
Es similar al método Get, pero incluye los parámetros después de una línea en blanco en la petición.
INTERNET
• Petición y respuesta usando el Método Post
INTERNET
Método HEAD
Funciona de la misma manera que Get, la diferencia es que solo trae el encabezado de la
respuesta.
Históricamente se ha empleado para revisar si un sitio tiene una nueva actualización y de
esta manera evitar traer material repetido.
INTERNET
• Petición y respuesta usando el Método Head
INTERNET
Categorías de Códigos de Estado
HTTPV 1.1
1xx – Información
2xx – Éxito
3xx – Redirección
4xx – Errores en la petición del cliente
5xx – Errores en del servidor
INTERNET
Encabezados HTTP
Los encabezados son metadatos adjuntos al mensaje HTTP
Sirven para mantener la sesión, establecer políticas de almacenamiento temporal, controlar
la autenticación e implementar la lógica de negocios
Existen distintos tipos de encabezados:
Encabezados Generales
Encabezados de petición
Encabezados de respuesta
Encabezados de entidad
INTERNET
Encabezados Generales
Aparecen en las peticiones y respuestas
Date: Especifica el tiempo y hora en que se crea el mensaje
Connection: Indica si el cliente o el servidor desean continuar con la conexión
Warning: Datos referentes a un error, que podrían ser útiles al tratar de resolverlo
INTERNET
Encabezados de Petición
Incluyen información de la petición y del cliente
User-Agent: Identifica el software en que se realizó la petición.
Host: Identifica el nombre del servidor a quien se dirige la petición.
Referer: Contexto en que se genera la petición, quizá la dirección web de la pagina en que se realiza.
Authorization: Parámetros de autorización y credenciales una vez autenticadas
INTERNET
Encabezados de Respuesta
Información sobre la respuesta y el servidor que despacha
Location:Al tener códigos de redirección (301,302) indica a que pagina se re direccionará.
www-Authenticate: En combinación con el código 401, el sistema pedirá el usuario y el
password del sistema.
Server: Indica el sistema servidor que despacha los mensajes.
INTERNET
Encabezados de Entidad
Content-Type: Indica el tipo MIME del cuerpo del mensaje.
Content-Lenght:Tamaño del cuerpo del mensaje.
Last-Modified: Indica la fecha y hora exacta de la ultima actualización del sistema.
INTERNET
Cokies
Como HTTP es un protocolo SIN ESTADO, se hace uso de cookies.
Es un string que se pasa en una cabecera HTTP y que el navegador puede guardar en un
pequeño archivo de texto
El cookie se reenvía luego al servidor HTTP con cada petición del cliente a ese servidor
Los cookies no pueden capturar información del cliente, sólo recuerdan información
proporcionada por el usuario al servidor (es el servidor quien los crea)
INTERNET
Uso de Cokies
Guardar las preferencias del usuario
Reconocimiento de usuarios
Ayuda a recoger datos usados por aplicaciones de compra electrónica.
El cookie puede guardar un identificador que permite al servidor acceder a todos los datos
almacenados en su base de datos.
INTERNET
Atributos de Cokies
Es un par (Nombre,Valor).
Comentario. Se puede presentar al usuario para explicar para qué se usa el cookie (políticadel sitio web)
Especificación de las páginas y dominios a los que se puede enviar el cookie
Fecha y hora de expiración, para controlar el tiempo máximo de una sesión antes de volvera pedir login.
Requiere o no una página segura
Versión
Tamaño máximo: 4Kbytes (Normalmente ocupan alrededor de 100 bytes)
Seguridad. Los cookies sólo pueden ir al dominio especificado; además, no conviene ponerinformación sensible en el cookie, mejor utilizar un identificador en él que sirva de clave deacceso en la base de datos del servidor.
INTERNET
Atributos de Cokies
Es un par (Nombre,Valor).
Comentario. Se puede presentar al usuario para explicar para qué se usa el cookie (políticadel sitio web)
Especificación de las páginas y dominios a los que se puede enviar el cookie
Fecha y hora de expiración, para controlar el tiempo máximo de una sesión antes de volvera pedir login.
Requiere o no una página segura
Versión
Tamaño máximo: 4Kbytes (Normalmente ocupan alrededor de 100 bytes)
Seguridad. Los cookies sólo pueden ir al dominio especificado; además, no conviene ponerinformación sensible en el cookie, mejor utilizar un identificador en él que sirva de clave deacceso en la base de datos del servidor.
WEB
1969:ARPAnet (Advanced Research Project Agency). Inicia públicamente en 1971.
1972: Correo electrónico.
1974:TCP/IP (RFC 675). Publicado en 1983 (RFC Request For Comments 793)
1984: Sistema de Nombres de Dominio (DNS,Domain Name System)
1986: Internet EngineeringTask Force (IETF)
1989:Archie, 1991: Gopher
1989:Tim Berners-Lee crea la World Wide Web: http://www.w3.org/History/1989/proposal.html.Además, en 1989 se escribe el primer servidor, http, y en 1990 el primer cliente (navegador).
1990: Internet se separa de ARPAnet
1993: Primer navegador web público, Mosaic
1994: World Wide Web Consortium (W3C). Fundado por Tim Berners-Lee al dejar el CERN eirse al MIT.
WEB
La Web es un sistema abierto para la publicación y acceso a recursos a través de
Internet mediante navegadores y servidores Web en todo tipo de plataformas.
Por tanto, se requieren navegadores, datos, servicios, documentos, tipos MIME
(MUltipurpose Internet Mail Extensions, en español extensiones multipropósito de
correo de internet), localización de recursos (URL) e Interacción (HTTP).
MIME conjunto de convenciones o especificaciones dirigidas al intercambio de
información a través de Internet de todo tipo de archivos (texto, audio, vídeo, etc.) de
forma transparente para el usuario.
WEB
Tipo MIME Subtipo Descripción
Texto
Plano Texto sin formato
HTML Texto incluyendo comandos de HTML
XML Texto incluyendo comandos de XML
ImagenGIF Imagen en formato GIF
JPEG Imagen en formato JPEG
AudioBasico Audio, 8-bit PCM ejemplo a 8000 Hz
Tono Un tono específico de audio
VídeoMPEG Película en formato MPEG
Puntero Representación de un dispositivo de puntero para presentación
AplicaciónStream-Octeto Una secuencia de bytes ininterrumpida
PostScript Un documento imprimible en Postscript
PDF Un documento imprimible en PDF
MultiparteMixto Las partes independientes en el orden especificado
Paralelo Las partes deben ser vistas simultáneamente
WEB
Mecanismo básico de la Web.
WEB
Los servidores Web o servidores HTTP son los programas que responden peticiones
que provienen de los clientes empleando el protocolo HTTP.
Los clientes web son los navegadores y otros programas que pueden realizar eticiones
a los servidores HTTP. Los navegadores son además clientes de protocolos como FTP
y e-mail.
los Proxy son los programas que funcionan como clientes y servidores, y sirven para
tener un mejor control de acceso externo en intranets y funcionan como método de
control en los firewall.
WEB
URL. El localizador de recursos uniforme (URL, Uniform Resource Locator) se refiere al
empleo de un esquema de notación uniforme, para localizar recursos accesibles
dentro de la red.
Por tanto, un URL identifica el servidor web y los recursos del mismo.
WEB
Partes de un URL:
Esquema (scheme)
Servidor (host)
Puerto (port)
Ruta (path)
Parámetros URL (;url-params)
Cadena de consulta (?query-string)
Anclaje (#anchor)
WEB
Partes de un URL:
Esquema (scheme)
Servidor (host)
Puerto (port)
Ruta (path)
Parámetros URL (;url-params)
Cadena de consulta (?query-string)
Anclaje (#anchor)
BIBLIOGRAFÍA
1. Aquino, A. Evolución de la Web, Ingeniería Informática - TAI 2, Universidad Católica "Nuestra
Señora de la Asuncion“ October, 2016.
2. Castaño, J.J. y Jurado, S. Comercio electronico. Editorial Editex, page 207, año 2016,
https://books.google.com.py/books?id=dJ1cDAAAQBAJ&lpg=PP1&hl=es&pg=PP1#v=onepage&q&
f=false
3. Consorcio W3C. https://www.w3.org/
4. Dominios y Puertos Internet. https://www.iana.org/
5. Expansión de la Web,. www.trendONE.de
6. Protocolos.
https://programas.cuaed.unam.mx/repositorio/moodle/pluginfile.php/795/mod_resource/content/7/c
ontenido/index.html
7. Tecnologías Web. https://w3techs.com/
8. Tutoriales Web. https://www.w3schools.com/
9. Web. www.radarnworks.com