¿Qué es una aplicación web?

 Una aplicación web es un conjunto de páginas web que son generadas en

respuesta a peticiones de un usuario.
 Internet tiene muchos tipos de aplicaciones web:
– Motores búsqueda
– Tiendas en línea
– Sitios de noticias
– Juegos
 Las aplicaciones web son accedidas desde un navegador de Internet, ya
sea en una PC o en dispositivos móviles.
Componentes de una aplicación web

 La aplicaciones web son del tipo cliente / servidor.

– El cliente (PC) solicita acceso a una aplicación que se encuentra en un servidor (Ej.
amazon.com).
 Las aplicaciones web se ejecutan en un servidor (computadora con más memoria y
procesador que una PC normal).
 En la mayoría de las aplicaciones web, el servidor también ejecuta una servidor de base
de datos (ej. Mysql).
¿Qué son las páginas web estáticas?

 Una página web estática es un documento HTML que es almacenado en un archivo (.html / .htm) y
raramente cambia el contenido.
 Hypertext Markup Language (HTML) es un lenguaje que los navegadores de internet entienden y lo
usan para mostrar (render) las páginas web al usuario final.
 Hypertext Transfer Protocol (HTTP) es el protocolo que los navegadores web y los servidores web
usan para comunicarse entre ellos.
¿Qué son las páginas web dinámicas?

 A diferencia de una página web estática, una página web dinámica cambia en base a los parámetros que son
enviados por el usuario o por otra página.
 La páginas web dinámicas son documentos HTML generados por la aplicación web.
 La aplicación web se desarrolla con un lenguaje de programación que es ejecutado en el servidor.
– Java (el objetivo de este curso)
– PHP
– .NET
 Las aplicaciones web modernas almacenan y recuperan los datos de un servidor de base de datos.
 El navegador de internet no sabe que lenguaje es utilizado en el servidor, el solo necesita que el servidor le
envíe documentos HTML válidos.
Conceptos básicos de Servlets

 Un Servlet es una clase java (.java) que permite procesar peticiones web
(HTTP Request) y devolver una respuesta (HTTP Response). Los Servlets
son clases que se ejecutan en el servidor.
 Son utilizados para recibir parámetros, ya sea vía GET, como por ejemplo
parámetros en la URL, o parámetros enviados por un formulario HTML
(POST).
 La respuesta que envía un Servlet puede ser de tipo HTML, XML, JSON,
incluso archivos como PDF, imágenes, video, audio, etc.
 En una aplicación MVC (Model, View, Controller), los Servlets juegan el
papel del Controlador.
 Los Servlets son la base de muchos Frameworks como Struts, Spring, JSF,
etc.
 Si sabemos como funcionan los Servlets, al utilizar cualquiera de los
Frameworks antes mencionados será mas rápido el aprendizaje.
Estructura básica de un Servlet
package net.itinajero.servlets;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest; Clases para utilizar HTTP
import javax.servlet.http.HttpServletResponse; Request y HTTP Response

public class holaMundo extends HttpServlet { Un Servlet hereda de HttpServlet

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
System.out.println("Petición de tipo GET");
}

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
System.out.println("Petición de tipo POST");
}
}
Configuración de un Servlet.

 Un Servlet no puede ejecutarse por si solo (Run). La forma de ejecutarlo siempre es mediante una URL. A esto
se le conoce como «Serlvet Maping».
 La configuración de un Servlet se realiza en el archivo WEB-INF/web.xml (deployment descriptor).
 Apartir de la versión API Servlet 3.0 (Tomcat 7 en adelante), se puede utilizar la anotación WebServlet
@WebServlet(name = “HolaMundo", urlPatterns = "/holaMundo")

<!-- Definimos un Servlet -->

<servlet>
<!-- Le damos un nombre al Servlet.-->
<servlet-name>HolaMundo</servlet-name>
<!-- Proporcionamos el nombre de la clase sn Extension -->
<servlet-class>net.itinajero.servlets.HolaMundo</servlet-class>
</servlet>
<!-- Mapeamos el Servlet a un URL -->
<servlet-mapping>
<!-- El nombre del servlet. El mismo definido en el tag <servlet> -->
<servlet-name>HolaMundo</servlet-name>
<!-- La URL con la cual se ejecutará el Servlet -->
<url-pattern>/holaMundo</url-pattern>
</servlet-mapping>
Ejecución de un Servlet HTTP Request - GET

 Un Servlet puede ser ejecutado por medio de una URL (GET). Cuando se
ejecuta de esta forma, en el Servlet se ejecuta el método doGET()

La URL que indicamos en el archivo

web.xml en el tag <url-pattern>

 Un Servlet puede ser ejecutado por medio de un <a> Link (GET). Cuando
se ejecuta de esta forma, en el Servlet se ejecuta el método doGET().

<a href="holaMundo">Ejecutar Servlet</a>

Ejecución de un Servlet HTTP Request - POST

 Un Servlet puede ser ejecutado por medio de un formulario HTML (POST).

Cuando se ejecuta de esta forma, en el Servlet se ejecuta el método
doPOST()

La URL que indicamos en el archivo

web.xml en el tag <url-pattern>

<form name="email_form" action="holaMundo" method="post">

<p>Please enter your e-mail address to subscribe to our newsletter.</p>
<p>E-Mail: <input type="text" name="email"></p>
<p><input type="submit" name="submit" value="Subscribe"></p>
</form>
Enviar y recibir parámetros a un Servlet (GET)

Recibir parámetros enviados por URL.

Los parámetros en la URL comienzan después de ‘?’
 Los parámetros son del tipo nombre = valor
 Cada parámetro es sepadado por el signo ‘&’
 La siguiente URL tiene 3 parámetros.
URL del Servlet Parámetros

/comentarios?name=alonso&perfil=admin&id=4852

 En el método doGet del Servlet los recibiríamos como:

String name = request.getParameter("name");
String perfil = request.getParameter("perfil");
String id= request.getParameter("id");
Enviar y recibir parámetros a un Servlet (POST)

Formulario HTML (HTTP POST)

<form name="contactanos" action="comentarios" method="post">
<fieldset>
<legend>Contáctanos</legend>
<label for="nombre">Nombre:</label><br>
<input type="text" name="nombre" id="nombre" autofocus required><br>
<label for="email">Email:</label><br>
<input type="text" name="email" id="email" required ><br>
<label for="grado">Ultimo grado de estudio:</label><br>
<select name="grado" id="grado">
<option value="secundaria">Secundaria</option>
<option value="preparatoria">Preparatoria</option>
<option value="licenciatura">Licenciatura</option>
<option value="maestria">Maestria</option>
<option value="doctorado">Doctorado</option>
</select><br>
<label for="comentarios">Comentarios:</label><br>
<textarea required name="comentarios" id="comentarios" cols="39" rows="5"></textarea><br><br>
<input type="submit" name="register" id="button" value="Register">
<input type="reset" name="reset">
</fieldset>
</form>

En el método doPost del Servlet los recibiríamos como:

String nombreParam = request.getParameter("nombre");
String emailParam = request.getParameter("email");
String gradoParam = request.getParameter("grado");
String comentariosParam = request.getParameter("comentarios");
Generar código HTML como respuesta

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

// La respuesta sera una pagina HTML
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();

// Con el objeto PrintWriter podemos escribir cualquier codigo HTML

out.println("<html>");
out.println("<head>");
out.println("<title>Catalogo de productos</title>");
out.println("<meta charset='UTF-8'>");
out.println("<meta name='viewport' content='width=device-width, initial-scale=1.0'>");
out.println("</head>");
out.println("<body>");
out.println("<h3>Catalogo de productos</h3>");
out.println("<table border='1' style='width:100%;'>"); • ESTE CODIGO HTML SERA ENVIADO
out.println("<tr>"); COMO RESPUESTA AL NAVEGADOR
out.println("<th>Categoria</th>");
out.println("<th>Nombre</th>"); DE INTERNET.
out.println("<th>Precio</th>"); • EL CODIGO JAVA LO PROCESA
out.println("</tr>");
out.println("<tr>"); APACHE TOMCAT (SERVIDOR)
out.println("<td>Electronica</td>"); • NUNCA ES ENVIADO AL NAVEGADOR
out.println("<td>Sterio Sony</td>");
out.println("<td>$50</td>"); CODIGO JAVA.
out.println("</tr>");
String nombreParam = request.getParameter("nombre");
out.println("<tr>");
String emailParam = request.getParameter("email");
out.println("</table>");
String gradoParam = request.getParameter("grado");
out.println("</body>");
String comentariosParam = request.getParameter("comentarios");
out.println("</html>");
}
Generar código HTML (DINAMICO) como respuesta

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// La respuesta sera una pagina HTML
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
…
out.println("<table border='1' style='width:100%;'>");
out.println("<tr>");
out.println("<th>id</th>");
out.println("<th>Categoria</th>");
• LA POTENCIA DE LOS SERVLETS, ES
out.println("<th>Nombre</th>"); QUE PODEMOS UTILIZAR TODO EL
out.println("<th>Precio</th>");
out.println("</tr>");
CODIGO JAVA QUE DESEEMOS PARA
MANIPULAR LOS DATOS QUE NOS
// Generamos contenido HTML dinamico
ProductoDB db = new ProductoDB();
ENVIO UN CLIENTE.
List<Producto> lista = db.getAll(); • EN ESTE EJEMPLO, LA LISTA DE
for (Producto prod : lista) {
out.println("<tr>");
PRODUCTOS LA ESTAMOS TRAYENDO
out.println("<td>"+prod.getId()+"</td>"); DE UNA BASE DE DATOS Y CREAMOS
out.println("<td>"+prod.getCategoria()+"</td>");
out.println("<td>"+prod.getNombre()+"</td>");
UNA TABLA HTML CON ESOS DATOS
out.println("<td>$"+prod.getPrecio()+"</td>"); DE FORMA DINAMICA, Y SE LA
out.println("</tr>");
}
ENVIAMOS AL CLIENTE (NAVEGADOR
// Termina contenido dinamico DE INTERNET)
out.println("</table>");
…
}
Resultado tabla HTML generada por el Servlet
Cliclo Request-Response de un Servlet
Cabecera de respuesta Content-Type

 Las cabecera de respuesta Content-Type se utilizan para indicar al

navegador Web el tipo de respuesta que será enviada por parte del
servidor Web.
 Ejemplo puede ser enviar diferentes tipos de contenido como respuesta
(Excel, HTML, XML, imágenes, etc).
 Para indicar el tipo de respuesta se utilizan los tipos MIME(Multipurpose
Internet Mail Extensions).
 Los tipos MIME son un conjunto de especificaciones con el objetivo de
intercambiar archivos de diferente tipo a través de Internet como puede
ser texto, audio, vídeo, entre otros tipos.
 Para espeficar el tipo MIME, se agrega un cabecera:
response.setContentType("image/jpeg");
Ejemplos más comunes de tipos MIME

Tipo MIME Descripción

text/html Documento HTML
text/xml Documento XML
text/css Hola de estilos CSS
video/mpeg Archivo de video MPEG
application/zip Archivo comprimido ZIP
application/pdf Archivo en formato PDF
application/vnd.ms-excel Hoja de calculo de excel
image/png Imagen en formato PNG
image/gif Imagen GIF (animación)
Enviar respuesta - HTML

protected void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
out.println("<!DOCTYPE html>");
out.println("<html>");
out.println("<head>");
out.println("<title>Respuesta tipo HTML</title>");
out.println("</head>");
out.println("<body>");
out.println("<h1>Hemos recibido tu informacion.</h1>");
out.println("<h2>Gracias por tus comentarios.</h2>");
out.println("</body>");
out.println("</html>");

}
Enviar respuesta - XML

protected void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {
response.setContentType("text/xml;charset=UTF-8");
PrintWriter out = response.getWriter();
out.println("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
out.println("<CATALOG>");
out.println("<CD>");
out.println("<TITLE>Empire Burlesque</TITLE>");
out.println("<ARTIST>Bob Dylan</ARTIST>");
out.println("<COUNTRY>USA</COUNTRY>");
out.println("<COMPANY>Columbia</COMPANY>");
out.println("<PRICE>10.90</PRICE>");
out.println("<YEAR>1985</YEAR>");
out.println("</CD>");
out.println("</CATALOG>");

}
Enviar respuesta - JSON
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// Set response type to JSON
response.setContentType("application/json");
PrintWriter out = response.getWriter();

out.println("{\"employees\":[\n" +
" {\"firstName\":\"John\", \"lastName\":\"Doe\"},\n" +
" {\"firstName\":\"Anna\", \"lastName\":\"Smith\"},\n" +
" {\"firstName\":\"Peter\", \"lastName\":\"Jones\"}\n" +
"]}");

/*
{"employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName":"Peter", "lastName":"Jones"}
]}
*/
}
Enviar respuesta – Imagen JPG
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.io.OutputStream;
import javax.imageio.ImageIO;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class RespuestaImagen extends HttpServlet {

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {

response.setContentType("image/jpeg");
String pathToWeb = getServletContext().getRealPath(File.separator);
System.out.println(pathToWeb);
File f = new File(pathToWeb + "images/tomcat.jpg");
BufferedImage bi = ImageIO.read(f);
OutputStream out = response.getOutputStream();
ImageIO.write(bi, "jpg", out);
out.close();
}
}
Redirigir respuestas

 Un servlet puede redirigir la respuesta, por lo general se usa para enviar al usuario a recursos externos. Por
ejemplo otro sitio.
 Para esto se utiliza el método sendRedirect del objeto response.

Método Descripción
sendRedirect(String Path) Envía una respuesta de tipo redirect, enviando al cliente a la dirección URL proporcionada
como parámetro.

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// Redirigir la respuesta relativa al directorio actual
response.sendRedirect("login.html");
// Redirigir la respuesta relativa al motor de servlets
response.sendRedirect("/pagar/efectivo");
// Redirigir la respuesta a otro servidor
response.sendRedirect("http://www.google.com");
}