Download Qué es una aplicación Q web Índice

Survey
yes no Was this document useful for you?
   Thank you for your participation!

* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project

Document related concepts
no text concepts found
Transcript
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