T T l í d L W b di á i Tema 4. Tecnologías de La Web dinámica

Transcripción

T T l í d L W b di á i Tema 4. Tecnologías de La Web dinámica
T
Tema 4. Tecnologías de La Web dinámica
T
l í d L W b di á i
Arquitecturas Distribuidas 09/10
1
Contenido del Tema 4
Procesado de información en el servidor. II
II.
C ki
Cookies
III. Lenguajes de programación en el servidor: PHP IV. Lenguajes de script en el cliente
V.
Bases de datos
VI. La Web en la actualidad
VII. Optimización de sitios web
I.
Arquitecturas Distribuidas 09/10
2
¿Qué es la web dinámica?
¿Q
y Originalmente la Web no era más que un servicio de intercambio de ficheros (estáticos: creados y almacenados en un servidor) enlazados entre sí.
y A medida que va evolucionando, el contenido de la web deja de ser estático, se genera dinámicamente mediante programa para cada petición.
y Documentos web que cambian en función de múltiples factores: q
p
y Información proporcionada por cliente fundamentalmente
y Acciones del usuario en el lado del cliente
y Servidores procesan la información y devuelven una respuesta en formato HTML (y muchas veces, además código para ejecutar en el cliente)
y Consecuencia: Internet deja de ser sólo una enorme BBDD distribuida de documentos y se convierte en una plataforma de servicios y aplicaciones
Arquitecturas Distribuidas 09/10
3
¿
¿Cómo se consigue?
g
y Mediante aplicaciones en el lado del servidor => procesan las peticiones de los clientes antes de devolver el documento.
y Mediante aplicaciones en el lado cliente => mejoran
> mejoran la interactividad y descargan al servidor de peticiones y procesado simple.
simple
y Con el uso extensivo de almacenamiento de datos
estructurados (bases de datos).
(bases de datos)
y Mediante el intercambio de datos entre máquinas.
Arquitecturas Distribuidas 09/10
4
Generación dinámica de Generación
dinámica de
documentos
Envía información para ser procesada en el servidor
Servidor HTTP
Genera HTML de respuesta
Procesa la información del cliente
A li ió t
Aplicación externa
Arquitecturas Distribuidas 09/10
5
I. Procesado de información en el servidor.
1.
Justificación y ventajas
j
p
1.1. Ventajas de las aplicaciones en el lado del servidor
1.3. Aplicaciones comunes
2. ¿Cómo se envía la información al servidor?
2.1 Formularios HTML
l
2.2 Envío de la información (métodos GET y POST)
3 ¿Cómo se procesa la información en el servidor?
3.
3.1. Common Gateway Interface (CGI)
3
3.2. Contexto de ejecución de la CGI j
3.4. Peticiones CGI
2.5. Respuestas CGI
2.6. Problemas de las CGI
bl
d l CG
Arquitecturas Distribuidas 09/10
6
Ventajas de aplicaciones en el lado del servidor
y Soporte multi‐plataforma
y Existen
E i t diferencias
dif
i (en los navegadores) que
( l d
) en ciertos
i t
casos evitan el funcionamiento correcto de los scripts en el lado del cliente. Esto
del cliente Esto no ocurre si el script está en el lado del servidor, ya que se ejecuta independientemente
de la plataforma del cliente.
y Solamente hay que optimizar el código en una
plataforma (la del servidor).
Arquitecturas Distribuidas 09/10
7
Ventajas de aplicaciones
en el lado del servidor
en el lado del servidor
y Mayores opciones para desarrollar aplicaciones
y Los programas
L en el lado
l l d del servidor
d l id no están
tá limitados
li it d
por razones de seguridad, por lo que pueden acceder a archivos y bases de datos.
y bases de datos
y Integridad del código
y Los clientes no tienen acceso directo al código, ya
al código ya que no es necesario para que éste se ejecute.
y Mantenimento
y Las modificaciones sólo se tienen que hacer en un punto
Arquitecturas Distribuidas 09/10
8
Aplicaciones comunes
p
y Motores de búsqueda
y Acceso a remoto a aplicaciones corporativas y bases de A
li i
i b
d datos.
y Acceso a boletines de noticias
A
b l i d i i
y Cualquier aplicación que se alimente de datos proporcionados por el usuario.
i
d l i
y Y miles más…
Arquitecturas Distribuidas 09/10
9
Algunos problemas a resolver
g
p
y ¿Cómo se envía la información al servidor?
y ¿Cómo se procesa la información en el servidor? Có l i f
ió l id ? ¿Quién la procesa? y ¿Cómo se agrupan un conjunto de peticiones Có j
d i i
relacionadas?
Arquitecturas Distribuidas 09/10
10
I. Procesado de información en el servidor.
1.
Justificación y ventajas
j
p
1.1. Ventajas de las aplicaciones en el lado del servidor
1.3. Aplicaciones comunes
2. ¿¿Cómo se envía la información al servidor?
2.1 Formularios HTML
2.2 Envío de la información (métodos GET y POST)
3. ¿Cómo se procesa la información en el servidor?
3.1. Common Gateway Interface (CGI)
f
(
)
3.2. Contexto de ejecución de la CGI 3 4 Peticiones CGI
3.4. Peticiones CGI
2.5. Respuestas CGI
2.6. Problemas de las CGI
Arquitecturas Distribuidas 09/10
11
F
l i HTML
Formularios HTML
y Necesitamos que el documento muestre al usuario la información que va a necesitar el servidor y permitirle que la rellene: nuevas etiquetas HTML.
que la rellene: nuevas etiquetas HTML
y Son elementos (etiquetas) que permiten al usuario insertar parámetros y valores que se envían hacia el servidor.
y La etiqueta para declarar un formulario es <FORM>.
FORM .
y El formulario indica además la URL de la aplicación q
que tiene que procesar la información que se va a q p
q
enviar
Arquitecturas Distribuidas 09/10
12
F
l i HTML
Formularios HTML
y Diferentes elementos pueden ir p
<html>
<!‐‐ Ejemplo 20 ‐‐>
insertados en un formulario:
<head>
<title>Titulo de la pagina</title>
p g
/
</head>
y Elementos de entrada de texto, claves, imágenes, archivos, checkbox, etc.
<INPUT
type=“TEXT|PASSWORD|...”>
<body>
y Es posible también declarar Formulario para seleccionar parametros
elementos ocultos , que no se elementos “ocultos”
que no se para enviar al servidor.
i l id
<form action=“procesar.cgi” method=“GET”>
muestran al usuario, pero sí Entrada de texto: <input name="a" contienen parámetros que se type="text"> <br>
envían al servidor.
Clave: <input type="password“ name="b" Clave: <input type
password name b maxlenght="8"> <br>
y Todos los elementos deben llevar Checkbox: <input type="checkbox“ name=“c"> <br>
el atributo “name”, que indicará Oculto: <input type="hidden" value="a">
como se llama el parámetro.
co
o se a a e pa á et o.
<br>
b
</form>
</body>
</html>
Arquitecturas Distribuidas 09/10
13
F
Formularios HTML
l i HTML
<html>
<!‐‐ Ejemplo 20 ‐‐>
<head>
<title>Titulo de la pagina</title>
</head>
<body>
Formulario para seleccionar parametros
para enviar al servidor.
<form action=“procesar.cgi” method=“GET”>
Entrada de texto: <input name="a" type="text"> <br>
Cl
Clave: <input type="password“ name="b" i
"
d“ "b" maxlenght="8"> <br>
Checkbox: <input type="checkbox“ name=“c"> <br>
Oculto: <input type= hidden value= a >
Oculto: <input type="hidden" value="a">
<br>
</form></body>
</html>
Arquitecturas Distribuidas 09/10
14
F
Formularios HTML
l i HTML
<html>
<!‐‐ Ejemplo 21 ‐‐>
y Elemento de selección <head>
<title>Titulo de la pagina</title>
</head>
<body>
Formulario para seleccionar parametros
para enviar al servidor.
<form action=“procesar.cgi” method=“GET”>
Selección: <select name="a">
<option> Primera
<option> Segunda
i
S
d
<option> Tercera
</select> <br> <br>
Área de texto: <textarea> Escriba aqui
varias lineas </textarea>
</form>
</body>
</html>
Arquitecturas Distribuidas 09/10
entre un grupo de opciones:
i
<SELECT> (<OPTION>)+
y Áreas de texto (texto con más de una línea):
<TEXTAREA>
15
F
l i HTML
Formularios HTML
<html>
<!‐‐ Ejemplo 21 ‐‐>
<head>
<title>Titulo de la pagina</title>
</head>
<body>
Formulario para seleccionar parametros
para enviar al servidor.
<form action=“procesar.cgi” method=“GET”>
Selección: <select name="a">
<option> Primera
<option> Segunda
i
S
d
<option> Tercera
</select> <br> <br>
Área de texto: <textarea> Escriba aqui
varias lineas </textarea>
</form>
</body>
</html>
Arquitecturas Distribuidas 09/10
16
Formularios HTML
y Existen, además dos elementos <INPUT> especiales:
y RESET: borra el formulario a su estado original
b
l f
l i t d i i l
y SUBMIT: presenta un botón para enviar el formulario.
y Incluso aunque no exista botón de envío el navegador I l i b ó d í l d suele enviar la información al pulsar enter
Arquitecturas Distribuidas 09/10
17
F
Formularios
l i HTML
<html>
<!‐‐ Ejemplo 21 ‐‐>
y Al pulsar el botón <head>
<title>Titulo de la pagina</title>
p g
</head>
<body>
Formulario para seleccionar parametros
para enviar al servidor.
i l id
<form action=“procesar.cgi” method=“GET”>
Selección: <select name="a">
<option> Primera
<option> Segunda
<option> Tercera
</select> <br> <br>
Área de texto: <textarea> Escriba aqui
varias lineas </textarea>
</form>
</body>
</html>
Arquitecturas Distribuidas 09/10
de envío, se ejecuta una petición al URL indicado en el atributo action
del <FORM>.
18
Envío de la información
y Puesto que se utiliza el protocolo HTTP, estamos limitados por su una interfaz: sólo se puede utilizar alguno de los comandos del protocolo.
y Se utilizan normalmente dos comandos del protocolo: GET o POST
l
y Dos tipos diferentes de peticiones, según atributo method del d l <FORM>.
y Peticiones GET (método GET de HTTP)
y Peticiones POST (método POST de HTTP)
y Al pulsar el botón de envío el navegador construye la petición adecuada
Arquitecturas Distribuidas 09/10
19
Peticiones GET
y Peticiones GET: (método GET de HTTP)
y
y
Los parámetros se añaden a la URL de la petición tras un signo de L
á t ñ d l URL d l ti ió t i
d ?
El formato es nombre_par=valor
p
yy separados por &
p
p
http://www.upct.es/cgi?name1=value1&name2=value2&name3=value3
•
Los caracteres especiales son trasladados a otros símbolos: Por ejemplo, los espacios se traducen a “+”, y los caracteres del ASCII extendido se envían con el formato %NNN (NNN: número del código ASCII e tendido)
código ASCII extendido).
Arquitecturas Distribuidas 09/10
20
Peticiones POST (I)
()
y Peticiones POST: (método POST de HTTP)
y Los parámetros se envían en el paquete HTTP, tras la línea de Los parámetros se envían en el paquete HTTP tras la línea de solicitud y las cabeceras de envío. Los parámetros son, por tanto, la entidad u objeto codificado en la petición.
y No se añade nada a la URL de la petición.
y Como en el método GET, los caracteres especiales se traducen a sus extensiones ASCII.
y Es necesario indicar el tipo de codificación en el <form> con el atributo enctype
y
y
application/x‐www‐form‐urlencoded
li i /
f
l
d d . (Por defecto). Similar a (P d f
) Si il GET. NO PERMITE ENVIAR ARCHIVOS
multipart/form‐data. Separa los parámetros mediante una marca (
(boundary) aleatoria. PERMITE ENVIAR ARCHIVOS
)
Arquitecturas Distribuidas 09/10
21
Peticiones POST (II), ejemplo
( ), j p
y Paquete HTTP de la petición
POST /pago.php HTTP/1.1
p g p p
Host: ait.upct.es
User‐Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; es‐ES; rv:1.9.0.15) Gecko/2009101601 Firefox/3.0.15 (.NET CLR 3.5.30729)
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept‐Language:es‐es,es;q=0.8,en‐us;q=0.5,en;q=0.3
Accept‐Encoding: gzip,deflate
Accept‐Charset:ISO‐8859‐1,utf‐8;q=0.7,*;q=0.7
Keep‐Alive: 300
Connection: keep‐alive
p
Referer:http://ait.upct.es/asignaturas/ad/post.html
Cache‐Control: max‐age=0
Enviar=Enviar&nombre=pepe&cuenta=212415
p p
45
Arquitecturas Distribuidas 09/10
22
GET vs POST
y Problemas GET
y No se puede enviar información binaria (archivos, imágenes, etc.) => necesario el método POST
y Problemas POST
y Rompe la funcionalidad del botón “Atrás” del navegador
y El botón actualizar repite la operación
y Principios generales
y GET implica “obtener” información. Operaciones idempotentes
y POST implica “realizar” una acción con un “efecto secundario”. Operaciones no POST i li “ li ” ió “ f t d i ” O
i
idempotentes
y Ejemplos
y Buscar usuarios o contenidos: GET
y Registrar usuarios o actualizar un perfil: POST
Arquitecturas Distribuidas 09/10
23
I. Procesado de información en el servidor.
1.
Justificación y ventajas
j
p
1.1. Ventajas de las aplicaciones en el lado del servidor
1.3. Aplicaciones comunes
2. ¿Cómo se envía la información al servidor?
2.1 Formularios HTML
l
2.2 Envío de la información (métodos GET y POST)
3. ¿Cómo se procesa la información en el Có l i f
ió l servidor?
3.1. Common Gateway Interface (CGI)
f
(
)
3.2. Contexto de ejecución de la CGI 3 4 Peticiones CGI
3.4. Peticiones CGI
2.5. Respuestas CGI
2.6. Problemas de las CGI
Arquitecturas Distribuidas 09/10
24
¿Cómo se procesa la información ¿Cómo
se procesa la información
en el servidor?
y El servidor HTTP en principio sólo recibe peticiones, recupera el documento indicado en el path de la URL y lo devuelve al cliente
y Si es necesario procesar información del cliente, el p
,
servidor debe encargarse de pasar dicha información a una aplicación externa que la procese y genere una respuesta
t
y ¿Cómo puede el servidor ejecutar un aplicación externa?
y ¿Cómo le pasa la información (parámetros GET o POST) que ha recibido a dicha aplicación?
y ¿Existe algún mecanismo estándar?
Arquitecturas Distribuidas 09/10
25
Common Gateway Interface (I)
y
()
y Common Gateway Interface
y Procedimiento estándar
d
d para comunicar servidores HTTP y aplicaciones externas para generar documentos de forma dinámica.
d
d f
d
y El URL de la petición identifica un programa ejecutable externo (el servidor web debe poder identificarlo como tal con algún criterio). y El servidor ejecutará el programa externo y le p
pasará los parámetros
p
Arquitecturas Distribuidas 09/10
26
Common Gateway Interface (II)
y
( )
El servidor recibe una petición con una serie de p
parámetros
2. El servidor reconoce que la URL no es un documento sino una aplicación externa
3. El servidor ejecuta la aplicación externa en un contexto especial
1.
1.
2.
Establece el valor de una serie de variables de entorno
Redirecciona la salida estándar (stdout) de la aplicación externa hacia él mismo
4. La información que recibe de la salida estándar la envía al cliente
1.
Añ d b
Añade cabeceras previas si es necesario
i i i
Arquitecturas Distribuidas 09/10
27
Common Gateway Interface (III)
CGI CGI especifica estos ifi procedimientos
Envía información para ser procesada en el servidor mediante GET o POST
Servidor HTTP
Genera HTML de respuesta
Procesa la información del cliente
El servidor recoge la respuesta de la aplicación externa, El id l d l li ió le añade cabeceras y la devuelve al cliente e a ade cabece as y a devue ve a c e te
Arquitecturas Distribuidas 09/10
A li ió t
Aplicación externa
28
Resumen CGI
y CGI especifica como pasar parámetros y ejecutar llas aplicaciones externas
li i
t
y La aplicación externa puede estar programada en cualquier lenguaje, siempre que éste sea capaz de l
l
d
aceptar la entrada según especifica CGI, y de crear una respuesta adecuada.
d
d
y Lenguajes más habituales: PERL, PYTHON, C, TCSH, BASH, Java.
Arquitecturas Distribuidas 09/10
29
¿Cómo pasar los parámetros e información adicional?
y Problema de comunicación entre procesos (repasar Tema 1): y Servidor y aplicación externa son dos procesos independientes
y p
p
p
y Múltiples soluciones. Se escoge la menos costosa computacionalmente
y Se utilizan variables de entorno: el SO las pone a disposición de cualquier proceso en ejecución
y En el contexto de ejecución, el servidor HTTP, establece las variables de entorno:
i bl d t
y CONTENT_LENGTH, CONTENT_TYPE, REMOTE_HOST, REMOTE_USER, REQUEST_METHOD, SERVER_NAME, QUERY_STRING, GATEWAY_INTERFACE, HTTP *
HTTP_
y La aplicación externa puede leer el valor de las que necesite, por ejemplo, en REMOTE_HOST el servidor escribe la dirección IP del cliente que ha hecho la petición
Arquitecturas Distribuidas 09/10
30
Peticiones CGI
y Dos formas diferentes. Depende del método con el que se envíen los parámetros, GET o POST
y Para peticiones GET la variable QUERY_STRING toma el valor de los parámetros, tal y como p
y
aparecen en la URL.
l
y La aplicación externa lee el valor de la variable
y Para peticiones POST los parámetros se pasan por P ti i
POST l á t la entrada estándar (stdin). y El servidor redirecciona hacia el mismo la entrada estándar de la aplicación externa al ejecutarla e introduce los parámetros
y La aplicación externa debe leer la entrada estándar.
L li ió t
d b l l t d tá d
Arquitecturas Distribuidas 09/10
31
Respuestas CGI
p
y La CGI escribe la respuesta en el stdout. El servidor lla lee, y se la envía al cliente.
l l í l li t
y Según el tipo de servidor, la CGI debe:
y Servidor NPH (No Parse Header): Escribir la respuesta completa (incluyendo cabeceras)
y Servidor PH (Parse Headers): Escribir la entidad d
(
d )
b l
d d
respuesta, y pasar al servidor indicaciones sobre cómo formar las cabeceras.
formar las cabeceras
y Lo habitual es que el servidor sea tipo NPH.
Arquitecturas Distribuidas 09/10
32
Respuestas CGI
p
y Para servidores NPH, una CGI debe generar la salida:
(Cabecera_CGI|Cabecera_HTTP)
[LÍNEA
Í
EN BLANCO]
[Cuerpo_Entidad]
L b
La cabecera_CGI es una de las siguientes:
CGI d l i i
y
y
y
Content‐type: Obligatoria si existe Cuerpo_Entidad
Location: devuelve un puntero (URL) en lugar de la información
p
(
)
g
Status: resultado de la operación, si no se incluye el cliente sobreentiende “200 OK”.
Arquitecturas Distribuidas 09/10
33
Problemas de las CGI
y CGI se ha quedado obsoleto
y En la práctica las aplicaciones que procesan las p
p
q p
y
y
y
y
peticiones se integran modularmente en el propio servidor HTTP
Integración Æ Servlets, SSI, PHP
Portabilidad Æ Servlets, PHP
Seguridad Æ Servlets, PHP
Escalabilidad Æ
l b l d d Servlets, PHP, ASP
l
y Cada vez que se recibe una petición hay que crear un nuevo proceso ‐> Es un proceso computacionalmente costoso
y Solución: se utilizan lenguajes de procesado integrados en la implementación del propio servidor (módulos adicionales). Ej.: Servlets, PHP, ASP
Arquitecturas Distribuidas 09/10
34
Referencias y bibliografía
y
g
y
CGI
y
y
y
y
http://ait.upct.es/asignaturas/ad/manuales/CGI/cgi.html Æ
Manual sobre uso de CGI
http://ait.upct.es/asignaturas/ad/manuales/CGI/env.html Æ
Documento que discute el entorno de ejecución de una CGI (en inglés)
http://ait.upct.es/asignaturas/ad/manuales/CGI/especificacion.ht
ml Æ Especificación CGI (en inglés)
Formularios HTML
y
y
http://html.conclase.net/w3c/html401‐es/interact/forms.html
GET y POST
y
Pruebe a buscar GET vs POST en Google
Arquitecturas Distribuidas 09/10
35

Documentos relacionados

Arquitecturas Distribuidas

Arquitecturas Distribuidas Arquitecturas Distribuidas TEMA 3. Tecnologías de la web

Más detalles