Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Programación en Internet 2007-2008 Departamento de Lenguajes y Sistemas Informáticos Qué es una aplicación Q web Programación en Internet Curso 2007-2008 Programación en Internet – Curso 2007-2008 Índice • • • • • • • • • Introducción Cliente Servidor Transferencia páginas web Ejemplo de aplicación web Entornos web Ventajas y desventajas Arquitectura de una aplicación web Metodología de diseño DLSI - Universidad de Alicante 1 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Introducción (1) • Web-based (web-enabled) application: – Aplicación ó informática f á que se ejecuta en entorno web – Aplicación cliente/servidor: el cliente, el servidor y el protocolo ya están definidos (implementados) – Cliente: navegador – Servidor: servidor web – Comunicación: protocolo HTTP Programación en Internet – Curso 2007-2008 ¿Una aplicación web? DLSI - Universidad de Alicante 2 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Introducción (y 2) • Protocolo: HyperText Transfer Protocol (HTTP) • HTTP Æ TCP/IP: TCP/IP no está tá orientado i t d a conexión ió • Se sitúa en el nivel 7 (aplicación) del OSI-RM (Open System Interconection-Reference Model) Programación en Internet – Curso 2007-2008 Cliente • Gestiona las peticiones del usuario y la recepción de las páginas que provienen del servidor • Interpreta los documentos HTML y sus recursos. Las tecnologías más empleadas son: – – – – – – – HyperText Markup Language (HTML) Cascading Style Sheets (CSS), DHTML Lenguaje de script (JavaScript, VBScript, etc.) ActiveX A l t en Java Applets J Plug-ins: Macromedia Flash, Autodesk MapGuide, ... Virtual Reality Modeling Language (VRML) DLSI - Universidad de Alicante 3 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Servidor (1) • Programa residente que espera peticiones: demonio (daemon) en Unix y servicio en servidores de Microsoft • En la aplicación del servidor hay: – Páginas estáticas (documentos HTML) – Recursos multimedia (imágenes y documentos adicionales del sitio web) – Scripts o programas de servidor que al ser invocados se ejecutan y dan como resultado una página HTML generada (pueden acceder a una BD) Programación en Internet – Curso 2007-2008 Servidor (y 2) • Tecnologías de servidor: – – – – CGI: complejo y poco eficiente SSI: estándar de “macros” de servidor web ASP (Microsoft): Windows, Windows NT JSP y Servlets (Sun Microsystems): Windows, algunos Unix – PHP (PHP.net): código fuente, binarios para Win32 y algunos Unix – ColdFusion C ldF i (Macromedia/allaire): (M di / ll i ) Wi Windows, d Windows NT, Linux, Solaris, HP-UX • Las más modernas tienen prestaciones que facilitan el desarrollo de aplicaciones DLSI - Universidad de Alicante 4 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Cliente/Servidor SERVIDOR CLIENTE HTTP HTML DHTML CSS JavaScript p VBScript p ActiveX Applets … CGI SSI ASP PHP JSP Servlets ColdFusion … Programación en Internet – Curso 2007-2008 Transferencia páginas web • Envío de la URL • Apertura de la conexión con el servidor – Siempre se abre una conexión nueva con cada petición del cliente (excepto con HTTP 1.1 que permite Keep-Alive Connections) • Solicitud de la página o recurso • Envío (o código de error) por parte del servidor • Interpretación del documento HTML y petición de otros objetos a los que hace referencia • Cierre conexión una vez que hayan llegado todos los recursos y documentos DLSI - Universidad de Alicante 5 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Ejemplo de aplicación web • Aplicación web sencilla basa en PHP • ¿Qué es PHP? PHP is a widely-used general-purpose scripting language that is especially suited for Web development and can be embedded into HTML. Programación en Internet – Curso 2007-2008 DLSI - Universidad de Alicante 6 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Programación en Internet – Curso 2007-2008 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" p g xml:lang="es" g lang="es"> g <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Listado de alumnos</title> <link rel="stylesheet" type="text/css" href="estilos.css" /> </head> <body> <h1>Listado de alumnos</h1> <table> <tr> <th>Nombre</th><th>Apellidos</th><th>Correo</th> </tr> DLSI - Universidad de Alicante 7 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 <? $bd = "aplic-web"; // resource odbc_connect ( string $dsn, string $user, string $password [, int $cursor_type] ) $con = odbc_connect($bd, "", ""); // resource odbc_exec odbc exec ( resource $connection_id, $connection id string $query_string $query string [, [ int $flags] ) $result = odbc_exec($con, "Select * From Alumnos"); // array odbc_fetch_array ( resource $result [, int $rownumber] ) while(($fila = odbc_fetch_array($result))) { $id = $fila["IdAlumnos"]; echo "<tr onclick=\"window.location.href='ficha.php?id=$id';\">"; echo h ""<td>" td " . $fila["Nombre"] $fil ["N b "] . ""</td>"; /td " echo "<td>" . $fila["Apellidos"] . "</td>"; echo "<td>" . $fila["Correo"] . "</td>"; echo "</tr>\n"; } ?> </table></body></html> Programación en Internet – Curso 2007-2008 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" p g xml:lang="es" g lang="es"> g <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Ficha de la asignatura</title> <link rel="stylesheet" type="text/css" href="estilos.css" /> </head> <body> <h1>Ficha de la asignatura</h1> <h2>Datos personales</h2> DLSI - Universidad de Alicante 8 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 <ul> <? $bd = "aplic-web"; // resource odbc_connect ( string $dsn, string $user, string $password [, int $cursor_type] ) $con = odbc_connect($bd, "", ""); // resource odbc_exec ( resource $connection_id, string $query_string [, int $flags] ) $result = odbc_exec($con, "Select * From Alumnos Where IdAlumnos = " . $_GET["id"]); // array odbc_fetch_array ( resource $result [, int $rownumber] ) while(($fila = odbc_fetch_array($result))) { echo "<li>Nombre: " . $fila["Nombre"] . "</li>"; echo h ""<li>Apellidos: li A llid " . $fil $fila["Apellidos"] ["A llid "] . "</li>"; " /li " echo "<li>Correo: " . $fila["Correo"] . "</li>"; echo "<li>Teléfono: " . $fila["Telefono"] . "</li>"; } ?> </ul> Programación en Internet – Curso 2007-2008 <h2>Asignaturas matriculadas</h2> <table> <tr> <th>Nombre</th><th>Descripción</th><th>Créditos</th> </tr> <? // resource odbc_exec odbc exec ( resource $connection_id, $connection id string $query_string $query string [, [ int $flags] ) $result = odbc_exec($con, "Select * From Asignaturas, Matriculas Where Asignatura = IdAsignaturas And Alumno = " . $_GET["id"]); // array odbc_fetch_array ( resource $result [, int $rownumber] ) while(($fila = odbc_fetch_array($result))) { echo "<tr>"; echo "<td>" <td> . $fila[ $fila["Nombre"] Nombre ] . "</td>"; </td> ; echo "<td>" . $fila["Descripcion"] . "</td>"; echo "<td>" . $fila["Creditos"] . "</td>"; echo "</tr>\n"; } ?> </table> <div><a href="index.php">Volver</a></div></body></html> DLSI - Universidad de Alicante 9 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Entornos web (1) • Internet: aplicación abierta y accesible desde Internet • Intranet: I t t lla aplicación li ió se ejecuta j t en una red d local l l con TCP/IP y servicios de Internet • Extranet: aplicación accesible desde Internet pero con restricciones (seguridad, VPN, etc.) Internet Intranet Extranet Programación en Internet – Curso 2007-2008 Entornos web (y 2) • Aplicaciones web: – Multi-channel: el usuario puede trabajar con la misma aplicación a través de distintos canales (ordenador, PDA, teléfono móvil, web TV, etc.) • Cada plataforma o tecnología es un canal de comunicación con la aplicación web – Cross-channel: los efectos producidos en una aplicación a través de un canal pueden ser percibidos por el usuario a través de otros canales DLSI - Universidad de Alicante 10 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Google para navegadores desde PC Google para navegadores desde PalmPC Programación en Internet – Curso 2007-2008 Ventajas y desventajas • Estandarización: TCP/IP, HTTP, HTML, … • Teletrabajo y movilidad: extranets • Reducción coste instalación y actualización clientes, gestión de versiones • Entorno del cliente controlado: navegador, versión, fabricante, etc. • Integración Internet e intranet (aprendizaje) • Independencia I d d i de d plataforma l t f (GUI) • Desventaja: versatilidad y potencia (limitaciones de HTML) y necesidad de buenas comunicaciones DLSI - Universidad de Alicante 11 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Arquitectura de una aplicación web (1) Cliente Servidor web + BD Navegador Servicio HTTP Consulta u Petición operación Respuesta Respuesta Base de datos Programación en Internet – Curso 2007-2008 Arquitectura de una aplicación web (2) Cliente Servidor web Navegador DLSI - Universidad de Alicante Servidor BD Servicio HTTP Consulta u Petición operación Respuesta Respuesta Base de datos 12 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Arquitectura de una aplicación web (3) Cliente Servidor web + aplicaciones + BD Navegador Servicio HTTP Base de datos Petición Consulta u operación p Respuesta Datos procesados Datos Servicio de aplicaciones Programación en Internet – Curso 2007-2008 Arquitectura de una aplicación web (4) Cliente Servidor web + aplicaciones Servidor BD Navegador Servicio HTTP Base de datos Petición Consulta u p operación Respuesta Datos procesados Datos Servicio de aplicaciones DLSI - Universidad de Alicante 13 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Arquitectura de una aplicación web (5) Cliente Servidor web Navegador Servidor BD Servicio HTTP Base de datos Petición Consulta u p operación Respuesta Servidor de aplicaciones Datos procesados Datos Servicio de aplicaciones Programación en Internet – Curso 2007-2008 Arquitectura de una aplicación web (y 6) Web Server Scripting (ASP, PHP) Ser idor web Servidor eb Servicio HTTP Servidor de aplicaciones (JSP) Ser idor web Servidor eb Servicio HTTP Ser. aplicaciones Lógica de negocio Servidor BD Datos Lógica de negocio (CSP) Ser idor web Servidor eb Servicio HTTP Servidor BD Lógica de negocio Servidor BD Datos Comunicación intraprocesos (rápida) DLSI - Universidad de Alicante Caché Server Pages Datos Comunicación interprocesos (lenta) 14 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Lógica de presentación HTML WML XML + XSLT Lógica de aplicación ASP PHP JSP CFM CSP Lógica de datos Access MySQL Oracle SQLServer Programación en Internet – Curso 2007-2008 Metodología de diseño (1) 1. Estudio de requisitos: contenido, objetivo, etc. etc 2. Elección de la tecnología, arquitectura del sitio web, proveedor del servidor y motor de la base de datos 3. Diseño de la estructura lógica o mapa de navegación 4 Diseño de la estructura física 4. 5. Creación de los contenidos 6. Diseño gráfico y ergonómico: colores, montaje, tipografía, etc. DLSI - Universidad de Alicante 15 Programación en Internet 2007-2008 Programación en Internet – Curso 2007-2008 Metodología de diseño (y 2) 7. Diseño de las páginas estáticas y elementos multimedia 8. Desarrollo de los scripts y páginas dinámicas 9. Verificación y pruebas: versiones, accesos navegación accesos, navegación, pruebas de carga, etc. 10. Puesta en marcha DLSI - Universidad de Alicante 16