post icon

Cargar datos de una base de datos con JSP

Hoy escribiremos por primera vez sobre JSP, Java Server Page. La evolución de los Servelts de Java, la cual se diferencia de su antecesor que ya no necesita ser compilado antes de deployarlo, sino este proceso se realiza por el servidor cuando el usuario lo solicita.

Trabajaremos con una base de datos MySQL, ya que es la más popular hasta hoy día para la plataforma web, de igual modo el ejemplo servirá para otros motores, solo deberíamos cambiar la capa de conexión por otra.

Trabajar con JSP y Netbeans es mucho más sencillo que con eclipse pero de igual modo lo haremos con este ultimo, personalmente he utilizado la versión Galileo para el ejemplo.

El ejemplo como siempre será lo más sencillo posible, en la BD necesitaremos crear una tabla básica de usuarios, que tengan nombres, los cuales mostraremos un listado de los mismos dentro de un Table HTML.

Una vez creado ésta tabla, que doy por hecho que lo pueden hacer, procederemos a crear nuestro proyecto Web. Una vez abierto nuestro IDE, buscaremos en el menú:

Archivo --> Nuevo --> Dinamic Web Proyect

Alli seteamos la configuración de desarollo, le colocamos el n0mbre al proyecto, yo le llamado JSPTroce, la versión del modulo que puede ser sin problemas el 2.4 o 2.5.

Siguiente --> Siguiente --> Finalizar

Una vez hecho esto, necesitaremos el driver JDBC para conectarnos a MySQL, la cual pueden descargar desde el sitio oficial. Más adelante también necesitaremos tener instalado el servidor o contenedor Web Apache Tomcat, preferentemente la versión 6, aunque debería funcionar sin ningún problema en la 5.5 el mismo lo descargan de aqui.

Una vez instalado el servidor, podemos copiar el driver que acabamos de descargar en el siguiente path dentro de nuestro proyecto (dentro del w0rkspace).

..\JSPTroce\WebContent\WEB-INF\lib\mysql-connector-java-5.1.10-bin.jar

Para continuar crearemos nuestra clase de conexión a la Base de Datos, sobre el proyecto damos click derecho y agregamos un nuevo package llamado:

conexionDB

Y dentro de éste package creamos una clase llamada

ConexionMySQL

La cual tendrá el siguiente código:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
package conexionDB;
 
import java.sql.Connection;
import java.sql.DriverManager;
 
public class ConexionMySQL {
 
	public static Connection con_mysql;
 
	public static Connection conectar(String pHost, String pUser,
			String pPassword) throws Exception {
		try {
			String databaseURL = "jdbc:mysql://" + pHost + "/cism";
			Class.forName("com.mysql.jdbc.Driver");
			DriverManager.setLoginTimeout(300);
			con_mysql = java.sql.DriverManager.getConnection(databaseURL,
					pUser, pPassword);
			System.out.println("Conexion con MySQL Establecida..");
		} catch (Exception e) {
			e.printStackTrace();
			throw new Exception(e);
		}
		return con_mysql;
	}
}

Con esto ya podemos conectar nuestra clase a la BD, solo nos falta crear la interface web. Para ello, al proyecto le agregamos una Pagina JSP nueva, llamada

usuarios.jsp

El mismo contendrá el siguiente código, y como verán en el mismo vemos mezclado tags HTML y Código Java, los que ya han programado en PHP notarán que es muy parecido el sistema. En cambio las etiquetas para encerrar el codigo java son estas:

<% aqui el codigo java %>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.sql.ResultSet" %>
<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.DriverManager" %>
<%@ page import="java.sql.SQLException"%>
<%@ page import="java.sql.PreparedStatement"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Prueba de JSP para DevTroce</title>
</head>
<body>
 
<%
Connection conn = null;
PreparedStatement ps = null;
ResultSet rs = null;
String SQL = null;
 
try{
	Class.forName("com.mysql.jdbc.Driver").newInstance();
	conn = DriverManager.getConnection("jdbc:mysql://127.0.0.1:3306/bd","usr","****");
 
	conn.setAutoCommit(false);
 
	SQL = "Select CodUsuario, Nombres, Apellidos from usuarios limit 10";
 
	ps = conn.prepareStatement(SQL, ResultSet.TYPE_SCROLL_INSENSITIVE, ResultSet.CONCUR_READ_ONLY);
 
	rs = ps.executeQuery();
 
	conn.commit();
	out.println("<h1 align=\"center\"> Lista de Usuarios </h1>");
	out.println("<table border=1 align=\"center\">");
	out.println("<tr><th>Nombres</th></tr>");
	while(rs.next()) {
		out.println("<tr><td>" + rs.getString("Nombres") + "</td></tr>");
	} // end while
	out.println("</table>");
} catch (SQLException exQL) {
	conn.rollback();
	out.println("Error SQL: " + exQL.getMessage());	
} catch (Exception ex) {
	conn.rollback();
	out.println("Error: " + ex.getMessage());
} finally {
	if (rs != null) rs.close();
	if (ps != null) ps.close();
	if (conn != null) conn.close();
} // end try
%>
</body>
</html>

La lógica es sencilla, ya hemos hecho anteriormente conexiones JDBC con MySQL, así que imagino que será fácil interpretarlas, cargamos los usuarios que tenemos en la tabla y recorremos el resultset con un while, metiendo los nombres en las etiquetas HTML correspondientes para crear las filas del Table. Con esto ya hemos terminado de construir todo el codigo necesario, ahora solo debemos deployarlo, vamos a registrar un servidor nuevo en nuestro eclipse, justamente el Apache Tomcat que habiamos descargado.

Archivo --> Nuevo -->Otro --> Server --> Server --> Siguiente --> Apache --> Tomcat v6.0 Server --> Siguiente --> Seleccionamos JSPTroce --> Finalizar.

Posicionandonos en el archivo usuarios.jsp presionamos

CTRL+F11

Y obtendriamos este resultado

JSPTroce

JSPTroce

Comentarios desde Facebook:

  1. avatar
    Samuel Safari
    6 diciembre 2012 at 21:18 #

    Me parecio interesante cuando creaste la clase para la conection a la bd, pero en el archivo .jsp volvilte a escribir el codigo para conectar a la bbd. En conclusion se entiene q lo q se busca es separar el codigo html del codigo java. Saludos.

  2. avatar
    aldo PERU Google Chrome Windows
    21 abril 2012 at 22:55 #

    jajaj como que no la utiliza con esa clase esta haciendo la conexion con la base de datos

  3. avatar
    miguel SPAIN Mozilla Firefox Windows
    29 marzo 2012 at 04:42 #

    Y para que decalras la clase ConexionMYSQL si luego resulta que no la utilizas..???

  4. avatar
    Susana SPAIN Internet Explorer Windows
    16 noviembre 2011 at 08:46 #

    Alguien ha encontrado la solución al problema que plantea Edgar? Nosotros tenemos el mismo problema y no sabemos como solucionarlo.
    Gracias

  5. avatar
    rik PERU Internet Explorer Windows
    4 mayo 2011 at 14:15 #

    esta es la web http://www.sipages.com/jetv2.shtml

  6. avatar
    rik PERU Internet Explorer Windows
    4 mayo 2011 at 14:14 #

    TODOS LOS PROBLEMAS QUE EH TENIDO CON MYSQL TOMCAT DENTRO DE MI IDE ECLIPSE AN SIDO PRINCIPALMENTE POR EL PUERTO DEL MYSQL EN LA CONEXION DE TU JSP, Y EN LAS VARIABLES DE ENTORNO,

    ACA TENGO LA WEB QUE ME AYUDO A CONFIGURAR ESOS PARAMETROS

  7. avatar
    Edgar MEXICO Mozilla Firefox Windows
    16 marzo 2011 at 11:14 #

    es buena la ayuda, pero yo segui todos los pasos y me aparece este error:

    Estado HTTP 500 –

    ——————————————————————————–

    type Informe de Excepción

    mensaje

    descripción El servidor encontró un error interno () que hizo que no pudiera rellenar este requerimiento.

    excepción

    org.apache.jasper.JasperException: An exception occurred processing JSP page /usuarios.jsp at line 43
    40: } // end while
    41: out.println(“”);
    42: } catch (SQLException exQL) {
    43: conn.rollback();
    44: out.println(“Error SQL: ” + exQL.getMessage());
    45: } catch (Exception ex) {
    46: conn.rollback();

    org.apache.jasper.servlet.JspServletWrapper.handleJspException(JspServletWrapper.java:554)
    org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:431)
    org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:319)
    org.apache.jasper.servlet.JspServlet.service(JspServlet.java:265)
    javax.servlet.http.HttpServlet.service(HttpServlet.java:802)

    causa raíz

    java.lang.NullPointerException
    org.apache.jsp.usuarios_jsp._jspService(usuarios_jsp.java:102)
    org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:97)
    javax.servlet.http.HttpServlet.service(HttpServlet.java:802)
    org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:389)
    org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:319)
    org.apache.jasper.servlet.JspServlet.service(JspServlet.java:265)
    javax.servlet.http.HttpServlet.service(HttpServlet.java:802)

    nota La traza completa de la causa de este error se encuentra en los archivos de diario de Apache Tomcat/6.0.0.

    ——————————————————————————–

    Apache Tomcat/6.0.0

    Y una cosa más si yo hice una interfaz en dreamweaver como la puedo conectar, o solo puedo pegar el codigo que me genero la interfaz en html y pegarlo en algun lado.

Responder