Transcript Desarrollo de aplicaciones Web
Instituto Tecnológico de Chihuahua II
Programación Web
Unidad 2. Introducción a las tecnologías Web.
2.1 Perspectiva Histórica de Internet.
• Internet.
Red mundial de computadoras interconectadas con un conjunto de protocolos.
2.1 Perspectiva Histórica de Internet.
Internet.
• Es un conjunto descentralizado de redes de comunicación interconectadas, que utilizan la familia de protocolos TCP/IP , garantizando que las redes físicas heterogéneas que la componen funcionen como una red lógica única, de alcance mundial.
2.1 Perspectiva Histórica de Internet.
Hechos más sobresalientes.
• 1961, como Leonard Kleinrock publicó desde el MIT el primer documento sobre la teoría de conmutación de paquetes • 1969, se estableció la primera conexión de computadoras, conocida ARPANET , entre tres universidades en California y una en Utah , Estados Unidos . • 1983, ARPANET cambió el protocolo NCP por TCP/IP. • 1989
,
Integración de los protocolos comunicaciones.
2,000 millones. OSI en la arquitectura de Internet, facilitando el uso de distintos protocolos de • 2006, Internet alcanzó los mil cien millones de usuarios. Se prevé que en diez años, la cantidad de navegantes de la Red aumentará a
2.1 Perspectiva Histórica de Internet.
Algunos servicios de Internet:
• Web (WWW o World Wide Web). Archivos de hipertexto.
• Correo electrónico (protocolo SMTP).
• Transmisión de archivos (FTP y P2P).
• Conversaciones en línea “chat” (IRC).
• Telefonía (VoIP).
• Televisión (IPTV).
• Acceso remoto a máquinas (SSH y Telnet).
• Juegos en línea.
2.1 Perspectiva Histórica de Internet.
WWW.
Uno de los servicios ofertados en la red Internet. Mucha gente lo confunde con el concepto de Internet.
2.2 Protocolo HTTP.
• Hyper Text Transfer Protocol (Protocolo de transferencia de hipertexto).
• Se usa para la transmisión de archivos de hipertexto (documentos HTML y multimedia) en Internet. Es decir, se usa en cada transacción de la Web.
2.2 Protocolo HTTP.
• Figura del uso del protocolo HTTP.
2.2 Protocolo HTTP.
• HTTP define la sintaxis y la semántica que utilizan los elementos software de la arquitectura web (clientes, servidores, proxies ) para comunicarse. Es un protocolo orientado a transacciones y sigue el esquema petición respuesta entre un cliente y un servidor. • A la información transmitida se la llama recurso y se la identifica mediante un URL .
2.2.1 Arquitectura del WWW.
Arquitectura Web cliente / servidor.
• Cliente. Ejecuta un interprete de HTML.
• Servidor. Controla el acceso, sirve la página solicitada, y puede ejecutar aplicaciones especiales (ej. Procesar formularios).
• Backend. Entrega datos al servidor.
• Servidor de aplicaciones. Enlaza el servidor a la base de datos.
2.2.1 Arquitectura del WWW.
• Una arquitectura de 3 capas:
2.2.1 Arquitectura del WWW.
• Otra vista de la arquitectura.
2.2.2 URL
• URL (Uniform Resources Location o “Localizador uniforme de recursos”).
• Es una secuencia de caracteres, de acuerdo a un formato estándar, que se usa para nombrar recursos, como documentos e imágenes en Internet, por su localización.
2.2.2 URL
• El URL de un recurso de información es su dirección en Internet , la cual permite que el navegador la encuentre y la muestre de forma adecuada.
2.2.3 Métodos HTTP
• HTTP es un protocolo que no maneja persistencia (sin estado), es decir no almacena información sobre sus conexiones, envíos, recepciones, destinatarios, receptores, etc.
2.2.3 Métodos HTTP
Lista de métodos.
• GET. Devuelve el recurso identificado en la URL pedida.
• HEAD. Funciona como el GET, pero sin que el servidor devuelva el cuerpo del mensaje. Es decir, sólo se devuelve la información de cabecera.
• POST. Indica al servidor que se prepare para recibir información del cliente. Suele usarse para enviar información desde formularios.
• PUT. Envía el recurso identificado en la URL desde el cliente hacia el servidor.
2.2.3 Métodos HTTP
Lista de métodos.
• OPTIONS. Pide información sobre las características de comunicación proporcionadas por el servidor. Le permite al cliente negociar los parámetros de comunicación.
• TRACE. Inicia un ciclo de mensajes de petición. Se usa para depuración y permite al cliente ver lo que el servidor recibe en el otro lado.
• DELETE. Solicita al servidor que borre el recurso identificado con el URL.
• CONNECT. Este método se reserva para uso con proxys. Permitirá que un proxy pueda dinámicamente convertirse en un túnel. Por ejemplo para comunicaciones con SSL.
2.2.3 Métodos HTTP
• Para manejar la persistencia HTTP, puede usar las “cookies”.
• Una “cookie” es un fragmento de información que se almacena en el disco duro del visitante de una través de su navegador , a petición del servidor página web a de la página. Esta información puede ser luego recuperada por el servidor en posteriores visitas.
2.2.3 Métodos HTTP
Uso de las cookies.
• Llevar control de usuarios.
• Ofrecer opciones de diseño.
• Conseguir información sobre hábitos de navegación del usuario.
• Se pueden administrar con Javascript.
2.3 Introducción al HTML.
El
HTML
, en inglés
H
yper
T
ext
M
arkup
L
anguage (lenguaje de marcas de hipertexto), es un lenguaje de etiquetas (o marcas) diseñado para estructurar textos y presentarlos en forma de hipertexto , que es el formato estándar de las páginas Web.
2.3 Introducción al HTML.
• Una vista de un archivo HTML en el editor de Visual Studio.
2.3.1 HTML como un tipo SGML •
SGML
son las siglas de
Standard Generalized Markup Language
o " Lenguaje de Marcado Generalizado". Consiste en un sistema para la organización y etiquetado de documentos. • El lenguaje SGML sirve para especificar las reglas de etiquetado de documentos y no impone en sí ningún conjunto de etiquetas en especial.
• El lenguaje SGML. HTML está definido en términos del
2.3.2 Elementos del lenguaje HTML.
• Las principales etiquetas de HTML son: • Clic aquí para abrir el archivo de etiquetas.
2.3.2 Elementos del lenguaje HTML.
Frames o marcos.
• Permiten definir divisiones en la página HTML. Útil para colocar el menú de navegación. • Normalmente permanece siempre a la vista el menú de navegación y lo que cambia es el contenido de la ventana principal.
• Ejemplo:
Ejemplo con “frames” o marcos
La vista del archivo anterior en el “browser”.
Ejemplo con “frames”.
• Las opciones de navegación en el menú, indica en la etiqueta de referencia, que las páginas se mostrarán en la ventana principal. Ejemplo:
2.3.3 Tablas en HTML
• Permiten el acomodo adecuado del contenido de la página. Debido a que en las páginas Web no es posible usar coordenadas de pantalla para colocar elementos.
2.3.3 Tablas en HTML
• Ejemplo de estructura de tabla:
| Celda 1, linea 1 | Celda 2, linea 1 |
| Celda 1, linea 2 | Celda 2, linea 2 |
2.3.4 Formularios.
• Un formulario HTML permite que el usuario ingrese datos y que estos sean enviados al servidor.
• Normalmente los datos serán almacenados en una base de datos.
2.3.4 Formularios.
• Ejemplo de un formulario sencillo.
2.3.4 Formularios.
• La vista parcial HTML del formulario anterior. Se muestra solo la etiqueta