2010Lenguajes Visuales Modelo HTTP Request/Response Web Browser Servidor Web HTTP Request Response...

2010 Lenguajes Visuales

Modelo HTTP Request/Response

Web Browser

ServidorWebHTTP

Request

ResponseCliente Servidor


Ejemplo Request/Response

http://www.google.com.ar/

GET / HTTP/1.1Host: www.google.com.arUser-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; es-ES; rv:1.9.1.2)

Gecko/20090729 Firefox/3.5.2 (.NET CLR 3.5.30729)Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8Accept-Language: en-usAccept-Encoding: gzip,deflateAccept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7Keep-Alive: 300Connection: keep-aliveCookie: PREF=ID=87ba9fd621efffdf:HTTP/1.x 200 OKDate: Thu, 13 Aug 2009 16:22:34 GMTExpires: -1Cache-Control: private, max-age=0Content-Type: text/html; charset=UTF-8Content-Encoding: gzipServer: gwsContent-Length: 3504

1. El usuario escribe una dirección en el navegador o hace clic en un link

2. El navegador genera el Request y lo envía al Server. Este es un ejemplo del Request

ServidorWeb

Servidor


Ejemplo Request/Response

ServidorWeb

Servidor

Web Browser

Response

HTTP/1.0 200 OK Date: Fri, 31 Dec 1999 23:59:59 GMT Content-Type: text/html Content-Length: 1354 <html> <body> <h1>Googl</h1> . . . </body> </html>

3. El servidor recibe y procesa el Request. Busca el recurso solicitado.El servidor genera el Response Correspondiente y lo envía al cliente.

4. El cliente recibe el Response y lo procesa. El browser obtiene el HTML, lo interpreta y muestra en la pantalla.


HTTP/HTML

• HTTP (HyperText Transfer Protocol): protocolo ampliamente utilizado para comunicación cliente servidor. Permite la comunicación del tipo Request Response simple. El cliente envía un HTTP Request y el servidor contesta con un HTTP Response.

• HTML (HyperText Markup Language): brinda información necesario para que el navegador sepa como mostrar el contenido al usuario.


HTTP Request

• Elementos principales que componen un HTTP Request:– Método HTTP (HTTP Method):

usualmente: GET, POST.– Recurso al que se accede (URL)– Parámetros del FORM


HTTP Response

• Elementos principales que componen un HTTP Response:– Código de estado (status code):

Indica si la operación fue realizada correctamente o no.

– Tipo de contenido (Content Type): Si el contenido es HTML, una imagen, un archivo PDF, etc.

– Contenido: el HTML, la imagen, etc.


HTTP Method

• El HTTP Method informa al servidor el tipo de Request que se está recibiendo y como está formado el resto del mensaje. El protocolo HTTP posee varios métodos (HTTP Methods), los más utilizados son:– GET: Enviado a través del clic en un link o

ingresando una dirección en el browser.– POST: Enviado a través del clic de un botón

SUBMIT de un formulario. El Request contendrá los parámetros completados en el formulario


Tecnologías involucradas en el cliente (Presentación)

• Se utiliza HTML para el desarrollo de páginas WEB. El HTML describe el contenido/estructura del documento.

• CSS (Cascade Style Sheet): Brinda el estilo y layout a la página.

• Javascript: Brinda la posibilidad de programación del lado del cliente. Brinda acción e interacción con el usuario de la página. (Ver filminas de JS)


“Thin-Client”

“Thick-Client”

“Object Web

Estructura de Aplicaciones Web

• Composición

Web Browser

ServidorWeb

Servidorde la

Aplicación

Aplic. Legacy

Almac. Datos

Aplicación

HTTP

Cliente Servidor


Evolución Tecnologías Web

Interactividad

Funcio-

nalidad

Servidorbasado enURLs

FormulariosCGIISAPINSAPI

HTML DinámicoScriptsCookies /SessionsASPsWeb ObjectsServlets

Applets / Java BeansControles ActiveXServidores de aplicaciónCORBA / DCOM / RMIXML, DOM, XSL


Modelo Hipertextual

• Modelo original de la WWW– Publicación y distribución de

documentos electrónicos

• Servidor de documentos, basado en URLs– Aplicación “2-tier”


Modelo de Formularios

• Protocolo CGI• Redirección de formularios HTML a

aplicaciones en el servidor

• Dificultades• Lento

– Cada ejecución produce la ejecución de un nuevo proceso

• Complejo• Protocolo “stateless” (HTTP)• No adecuado para aplicaciones grandes• No adecuado para clientes Java (orientados

a objetos)


CGI

Submit Submit GET / POST Colocar valores

Ejecutar

Programa

CGI

Variables de EntornoServidor WebBrowser

CLIENTE

SERVIDOR

Leer valoresInput

OutputRetornar

Docto. HTML


Evoluciones de HTTP / CGI

• Algunas soluciones propuestas:– Frameworks / APIs

• Netscape’s NSAPI, Microsoft’s ISAPI, Apple’s WebObjects, JavaSoft’s Servlets

– Evitar la ejecución de un nuevo proceso ante cada pedido

• Extensiones residentes en memoria– DLL’s, plug-ins en el servidor, Java Servlets, ORBs

– Scripting en el servidor• Microsoft’s ASP, JavaSoft’s Java Server Pages (JSP)

– Estas alternativas siguen requiriendo HTTP y el servidor Web

• El servidor Web media entre los objetos en el cliente y los objetos del servidor


Servlets

• Java Servlet API• Mecanismo comunicación aplicación-

clientes web. • Independencia de la plataforma• Modelo general:

– Clase proveyendo un servicio (“service”) dado– Servidores pequeños y especializados

• Servlet Container (Servlet Engine)• Administra detalles de :

– Conexión a la red– Parsing de los pedidos del cliente web– Respuestas correctamente formateadas– Ciclo de vida del servlet


JDBCapjv1.1

JVM

Servlet Container

Zones

Servlets

BrowserServidor Web

Servlets

ModJserv

SERVIDORCLIENTE

HTTP

Apache


Servlets

Servlet Container

Servlet

Creación container

Pedido HTTP1

Pedido HTTP2

Respuesta HTTP1

Respuesta HTTP2

Creación Servlet

init()

service()

service()

destroy()

Destrucción Servlet

Inicialización

ProcesamientoPedido1

ProcesamientoPedido2

LiberaciónRecursos


public class LoginServlet extends HttpServlet { Connection conn; public void init(ServletConfig config) throws ServletException {

conn = connectToDB(“uargbooks”); }

public void doGet(HttpServletRequest req,HttpServletResponse resp) {resp.SetContentType(“text/html”);PrintWriter out = resp.getWriter();String query = “SELECT * FROM users WHERE (login=\””+

req.getParameter(“login”)+”\” AND passwd=\””+req.getParameter(“contrasenia”)+”\”)”;

Statement st = conn.createStatement();ResultSet rs = st.executeQuery(query);if (rs.next()) { // consulta exitosa

out.println("<HTML> .......");out.println("<P>Bienvenido a su cuenta de UARGBooks .... ");out.println(“ ........</HTML>");

} else {out.println("<HTML> .......");out.println("<P>Lo siento, intentelo nuevamente .... ");out.println(“ ........</HTML>"); }

out.close(); } }

GeneraciónHTML

Servlets: Ejemplo

Servicio Implementado

Acceso BD

Acceso Parámetros


Cookies

• Una cookie es información enviada por el servidor web al navegador.

• Las Cookies representan dicha información en pares clave-valor

• Las Cookies son guardadas en los navegadores

• Los navegadores almacenan las cookies relativas a un sitio o host.

• Una vez guardadas en los navegadores, las cookies son enviadas en cada request al servidor web.


Cookies - ¿Para que se utilizan?

• Tacking• Autenticacion• Personalización• Administración de Sesión (Session

Management)• Administración de Estado (State

Management)

Cookie userCookie = new Cookie("user", "uid1234");


Cookies

• Creando una cookie:– Cookie color = new Cookie(“color", “RED");

• Agregar la Cookie al HTTP Response:– response.addCookie(color);

• Leer cookies enviades desde el cliente:– Cookie[] cookies = request.getCookies();

HTP/1.1 200 OKContent-type: text/htmlSet-Cookie : color=RED

Get index.html HTTP/1.1Host: www.colpix.com.arCookie: color=REDAccept: */*


HTTP Session - ¿Qué es?

• Session es el mecanismo para mantener informacion sobre el estado de una aplicación entre Requests de un cliente.

• La Session mantiene la identidad de un cliente entre Requests

• Del lado del Servidor, la Session es identificada por un único “session id”.

• Es el mecanismo por el cual se pueden asociar una serie de HTTP Request

• Mantiene estado del cliente


HTTP Session

• ¿Por qué es necesario?– HTTP es un protocolo “stateless” (no se

guarda información de estado entre Requests)

– Muchas aplicaciones Web requieren mantener el estado entre Request: Ejemplo: “carrito de compras”

• ¿Cómo se mantiene las HTTP Session?– Utilizando Cookies (Muy utilizado)– URL Rewriting– Otros (Sessiones basadas en SSL,etc)


HTTP Session API

• La especificación de Servlet provee la interface HTTPSession para mantener la información relativa a la Session.

• El Contenedor hace disponible a este objeto en tiempo de ejecución.

• Para acceder al HTTP Session:– HTTPSession session = request.getSession(boolean);

• Para la administración de estado de la aplicación:– session.setAttribute(String key, Object value);– session.getAttribute(String key);– session.removeAttribute(String key);

• Para destruir la HTTP Session:– session.invalidate();


HTTP Session

• HTTP Response (una vez creada la session, se envía información al cliente con el id de session)

HTTP/1.1 200 OK

Set-Cookie: JSESSIONID=0AAB6C8DE415

Content-Type: text/html

Content-Length: 397

Date: 08 Oct 2009 03:25:40 GMT

Server: Apache-Coyote/1.1

Connection: close

<html> ...</html>


HTTP Session

POST /registrar.do

HTTP/1.1 Host: www.colpix.com.ar

User-Agent: Mozilla/5.0

Cookie: JSESSIONID=0AAB6C8DE415

Accept: text/xml,application/xml,application/xhtml+xml,text/ html;q=0.9,text/plain;q=0.8,video/x-mng,image/png,image/ jpeg,image/gif;q=0.2,*/*;q=0.1

Accept-Language: en-us,en;q=0.5

Accept-Encoding: gzip,deflate

•HTTP Request (se envía información al servidor sobre la identificación de la session en forma de cookie)


HTTP Session - Configuración

• Es posible configurar el timeout de la session para una aplicación web en el descriptor de deploy (web.xml)<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns = http://java.sun.com/xml/ns/j2ee …

<session-config> <session-timeout>30</session-timeout> </session-config>

</web-app>


HTTP Session. Ejemplo

public class LoginServlet extends HttpServlet {....public void doGet(HttpServletRequest req,HttpServletResponse resp) {

// Obtener “objeto sesión”HttpSession sesion = req.getSession(true);

Boolean logeado = (Boolean) sesion.getValue(“logged”);if (!logeado || (logeado == null)){

.... // Codigo busqueda usuario en BDif (sucess) { ..... sesion.putValue(“logged”, true);

sesion.putValue(“user_logged”,req.getParameter(“login”));} else { .... }

} else {.....out.println("<P>Ya existe un usuario logeado .... ");

} out.close();

} }

Acceso HttpSession

Acceso y colocaciónde valores


Servlets: Contextos

• Mantenimiento de 1 estado compartido por varios usuarios– ServletContext

• Administra recursos compartidos por un grupo de servlets

• Aplicación típica: “Chat”....RoomList roomlist = createRooms();getServletContext().setAttribute(“roomList”, roomlist); ....


Servlets vs. JSP

• Servlets:– “Código”– Adecuados para programadores– Foco en la funcionalidad / control de la

aplicación

• JSP– “Página HTML/XML” + “scripts”– Adecuados para diseñadores de

páginas– Foco en el diseño de las presentaciones


Servlets vs. JSP

• De esta manera se crea una página web dinámica en un Servlet. Hay que utilizar un output stream:

• Un JSP “parece” un HTML al que se le puede ingresar código y recursos Java.

• Un JSP finalmente, se traduce en una clase Servlet

out.println(“<html> <body>” + “<h1>Hola” + nombre + “</h1></body></html>”);

Servlet

<html>

<body>

<h1>Hola <%= nombre %></h1> </body>

</html>

JSP


JSP: Java Server Pages

• Ventajas:• Separación de contenido estático y dinámico• Portabilidad (“Write Once Run Anywhere”)• Transparencia del concepto de Servlet

• Características del lenguaje• Scriptlets / Directivas / Declaraciones /

Expresiones (Expresion Lenguage)• Tags (JSTL)• Facilidades de sincronización, manejo

excepciones, administración de sesiones.


JSP: Java Server Pages

• Finalmente un JSP es un Servlet– El contenedor traduce el JSP en

archivo que contiene una clase fuente Servlet (.java), luego compila esta clase y se obtiene el archivo compilado .class de dicho Servlet

– Dicho Servlet se comporta de la misma manera que un Servlet codificado a mano: • El contenedor lo carga, lo instancia, lo

inicializa, genera un thread para cada request e invoca el método service()


Tipos de elementos JSP

• Scriptlet: <% %> – Código Java embebido en el JSP

• Directive: <%@ %> – Page: <%@ page import=”foo.*” session=”false” %>– Taglib: <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

– Include: <%@ include file=”header.html” %>

• Expression: <%= %> – Expresiones.

• Declaration: <%! %>– Forma de declarar un atributo a nivel de Servlet

• EL expression: ${ } – Expression Language

• Action: <jsp:include page=”footer.html” />


Arquitectura JSP

<%@page import=“java.text.*, java.util.*” *>

<html>

<body>

<%

Date d = new Date ();

String today = DateFormat.getDateInstance().format(d);

%>

Today is:

<em> <%=today%> </em>

</body>

</html>

Servlet

Página (archivo .JSP)

Compilación de la Página

ScriptletExpression Directive


Modelo 1 JSP

JDBC

Container

Browser

Beans

SERVIDORCLIENTE

JSP


Modelo 2 JSP

Container

Browser

Beans

SERVIDORCLIENTE

JSP

Servlet


Scriptless JSP

• Es difícil (costoso) el mantenimiento de aplicaciones Web utilizando JSP con código embebido

• Los diseñadores Web no se sienten a gusto con el código Java embebido en el JSP

• Es posible utilizar EL, Estándar Actions, taglibs, etc. para no tener que utilizar código embebido

• Ejemplo: las siguientes expresiones obtienen el mismo resultado:1. ${persona.mascota.nombre} 2. <%= ((foo.Persona)

request.getAttribute(“persona”)).getMascota().getNombre() %>


JSP Standard Tag Library (JSTL)

<%@ taglib prefi x=”c” uri=”http://java.sun.com/jsp/jstl/core” %> <html> <body>

<c:if test=“${empty param.userName}” > <jsp:forward page=”registrarse.jsp” />

</c:if>

<h1>Bienvenido! ${param.userName}</h1> </body></html>

<table><c:forEach var=”pelicula” items=”$

{peliculas}” ><tr><td>${pelicula}</td></tr>

</c:forEach></table>


Referencias

• “Fundamentals of Java servlets”• http://java.sun.com/developer/onlineTraining/Serv

lets/Fundamentals/

• “Java Server Pages Fundamentals”• http://java.sun.com/developer/onlineTraining/JSPIn

tro/contents.html

• “Understanding JavaServer Pages Model 2 architecture”

• http://www.javaworld.com/javaworld/jw-12-1999/jw-12-ssj-jspmvc.html

• “Servlets and JSP Pages Best Practices”• http://java.sun.com/developer/technicalArticles/ja

vaserverpages/servlets_jsp/

http://java.sun.com/developer/onlineTraining/Servlets/Fundamentals/

http://java.sun.com/developer/onlineTraining/Servlets/Fundamentals/

http://java.sun.com/developer/onlineTraining/JSPIntro/contents.html

http://java.sun.com/developer/onlineTraining/JSPIntro/contents.html

http://www.javaworld.com/javaworld/jw-12-1999/jw-12-ssj-jspmvc.html

http://www.javaworld.com/javaworld/jw-12-1999/jw-12-ssj-jspmvc.html

http://java.sun.com/developer/technicalArticles/javaserverpages/servlets_jsp/

http://java.sun.com/developer/technicalArticles/javaserverpages/servlets_jsp/

2010Lenguajes Visuales Modelo HTTP Request/Response Web Browser Servidor Web HTTP Request Response...

Documents

Transcript of 2010Lenguajes Visuales Modelo HTTP Request/Response Web Browser Servidor Web HTTP Request Response...