Como Conectar a MySQL desde una pagina .JSP de Java Page

Conectar a MySQL desde una pagina .jsp creada con Java Page

En muchas ocasiones queremos tener una Base de Datos para gestionar información de forma  mas dinámica en nuestras paginas, para no tener que escribirlas directamente en paginas Web y simplemente queremos crear una aplicación que interactúe con una Base de Datos para su funcionamiento.

Vamos a ver como crear una conexión a una base de Datos MySQL para unirla a pagina JSP.

Para ello vamos a crear un proyecto con Netbeans o Eclipse, cualquier que tengas instalado en tu equipo. Igualmente debes tener instalado MySQL. Si no lo tienes instalado puedes seguir el siguiente enlace para su instalación en sistemas Linux basados en Debian, como Ubuntu.

Como instalar MySQL facil y rápido

En mi caso voy a utilizar Netbeans, que para cuando lo descargue estaba en su ultima versión y no estaba disponible en Español, lo abrimos y procedemos a crear un proyecto, buscamos Archivo (File) y luego Nuevo Proyecto (New Project):

Buscamos el tipo de proyecto que en nuestro caso será de categoría Java Web  y el proyecto en si es una aplicación web Web Application y pulsamos Siguiente (Next).

Escribimos el nombre que le daremos al proyecto y lo demás lo dejamos por defecto como nos lo muestre Netbeans. Pulsamos Siguiente (Next).

A continuación Netbeans nos sugiere el servidor a utilizar, la versión de Java EE y el path, lo dejamos como está.Pulsamos Siguiente (Next).

Luego nos presenta la siguiente pantalla para el caso de que quisieras utilizar al gún framework en la aplicación. Los dejamos sin marcar ya que no lo vamos utilizar.Pulsamos Terminar (Finish).

Aparecerá nuestro proyecto ya creado y nos creará una página index.html como vemos abajo. Vamos a pulsar sobre la punta de flecha que tiene el nombre de proyecto al lado izquierdo del icono que simula un globo azul, para desplegar los componentes del proyecto.

Y se nos debe mostrar y pantalla similar a la siguiente. Fíjate que vamos a pulsar ahora sobre la punta de flecha que esta al lado izquierdo del componente que dice Web Pages, el cual desplegará una subcarpeta llamada WEB-INF dentro de la cual está el archivo index.html com ose indica.

 Esta página no nos interesa, porque utilizaremos una .jsp, por lo tanto marcaremos el archivo index.hmtl como arriba y pulsaremos F2 lo cual producirá un recuadro rojo como vemos abajo en el cual pondremos el nombre que queramos para renombrar el index. Usare old.

Y aquí puedes ver el nombre ya cambiado.

Ahora crearemos un index.jsp, que es donde luego nos conectaremos a muestra Base de Datos MySQL mediante una clase que vamos a crear. Vamos a crear primero el index.jsp y luego crearemos la clase, solo para llevar un orden ya que en realidad podríamos hacerlo al revés. Volvamos entonces a nuestro Netbeans y nos ponemos sobre el nombre del proyecto lo marcamos y pulsamos sobre el botón derecho del ratón, luego pulsamos sobre Nuevo (New) y buscamos la opción JSP y pulsamos sobre ella.

A continuación nos saldrá una pantalla similar a la siguiente, escribimos index y dejamos todo lo demás como está y pulsamos en Terminar (Finish).

Fíjate que se ha creado el nuevo archivo index.jsp dentro de la subcarpeta WEB-INF y que tenemos del lado derecho el contenido en una nueva pestaña. Puedes  compararlo con el contenido de old y verás las diferencias. Una evidente es que old solo tiene etiquetas html, mientras que index.jsp tiene ademas etiquetas servlets, que sirven para poder usar el lenguaje de programación java inscrustado con html básicamente. Modificaremos una cosa y agregaremos otra que deberías tener en cuenta con con las páginas JSP.

Fíjate en la imagen de abajo, compara la misma con la anterior y debes notar que se modificó la etiqueta meta dejando solo el atributo charset="utf-8", esto es debido a que actualmente lo que se usa es html5 para el cual solo es necesario indicar ese atributo. El anterior se usaba para el html4. De cualquier forma si vas a utilizar otro versión html debes modificar esta linea y adecuarla según sea el caso, para que no tengas problemas. Vemos además que se ha añadido una linea con un comando java que especifica la codificación utf-8. Esto es para que el intercambio de datos entre java y html no te den resultados inesperados con las ñ y los acentos, a la hora de mostrar nombres o palabras en la página web. Esto es opcional, hacerlo no tiene nada que ver con la conexión a MySQL.

Es importante que cuando hagas cambios en la página pruebes la misma y que todo este funcionando, o por lo menos no este provocando algún error. Se aconseja probar la ejecución a cada cambio que se haga, es decir, en lo que cambies la el contenido de la etiqueta meta, prueba con el index.jsp funcione y luego al añadir la linea de comando java igualmente volver a probarla y se hace como se indica en la siguiente pantalla:

Colocas el puntero del ratón sobre index.jsp marcándolo y pulsas el botón derecho del ratón, y te aparece el menú contextual en donde escoges la opción Correr Archivo (Run File) y pulsas sobre la opción.

Si no haz hecho esto antes la primera vez se tardará algún tiempo inicializándose el servidor Glassfish o el Apache Tomcat y finalmente saltará el navegador con una nueva pestaña mostrándote algo similar a la siguiente pantalla:

Hasta ahora hemos seguido un orden y manteniendo el código lo más limpio que se pueda. Puedes añadir comentarios para aclarar que haces en cada paso. El orden te llevará a poder hacer cambios y correcciones de forma más rápida y directa.

Ahora vamos a crear un paquete nuevo, el cual contendrá el archivo en el cual crearemos nuestra clase de conexión a MySQL, de esta forma sabrás donde buscarlo si tienes que acceder a el en cualquier momento de forma directa y según la funcionalidad que les des a cada uno.

Vamos a Netbeans y nos ubicamos Source Packages lo marcamos y pulsamos el botón derecho del ratón lo cual nos abre un menú contextual con elegimos la opción Nuevo (New) y sale otro submenú contextual en el cual elegimos la opción Java Package y pulsamos sobre ella.

Se nos abrirá una ventana con el siguiente formulario que se muestra a continuación, en donde solo escribiremos el nombre que le daremos al paquete en el recuadro Package Name. Puedes usar cualquier nombre. Pulsamos en Terminar (Finish).

Verás como ahora aparece el paquete recién creado debajo de la subcarpeta Source Packages. Te ubicas encima del paquete recién creado y pulsas el botón derecho del ratón, saldrá un menú contextual en el cual escogerás New y volverá a salir otro menú contextual donde escogerás Java Class

Aparece la siguiente pantalla con un formulario en el que solo rellenamos el de Class Name, poniendo el nombre que queramos y dejando lo demás como esta. Pulsamos en Terminar (Finish).

Nos aparece ahora en el Netbeans el contenido del archivo que acabamos de crear, Vemos que el archivo pertenece al package que creamos y que ya esta declarado el encabezado de la clase.

Ahora necesitamos utilizar un driver que nos permita establecer la conexión con la base de datos, y cada tipo de base de datos necesita un driver en particular. En nuestro caso necesitamos el driver para MySQL, y java tiene en este caso un driver por defecto. En caso de no tenerlo tendríamos que descargar el archivo .jar desde Oracle, que es el tipo de archivo que se utiliza para  las librerías en java. Vamos entonces al Netbeans y ubicamos el puntero del cursor del ratón sobre la carpeta Libraries y pulsamos el botón derecho del ratón, lo caul abre un menu contextual y elegimos la opción Add Library.

Vemos que nos aparece la ventana de abajo a la izquierda, y buscaremos entre la opciones hasta que podamos ubicar el MySQL JDBC Driver que es el que necesitamos añadir a la librería del proyecto.

Este archivo no es mas que una librería más,  que contiene las rutinas de conexión especificas para MySQL. Pulsamos sobre el botón Add Library y añadimos el driver. 

Ahora ya estamos en condiciones para conectar nuestro programa a la base de datos. Puedes revisar ahora tu bases de datos MySQL, para determinar cual usarás. En el ejemplo usaré phpmyadmin para revisarla y echarle una mirada a la base de datos que usaré llamada codejavu, como puedes ver en la siguiente imagen:

Lo anterior no es necesario para la programación que estamos haciendo. Solo es una rutina de revisión que se puede hacer en cualquier momento, para saber como se llama la base de datos a la que queremos conectarnos. Para una programación posterior de manipulación de datos podemos consultar para ver las tablas y los campos que la conforman, para luego usarlas en nuestro programa real.

Hasta ahora todo solo a sido rutina y fácil de ejecutar. Pero ahora empezaremos a escribir algo código que  ya nos mete en materia. Escribe el siguiente código:

import com.mysql.jdbc.Connection 

En la clase ConectaBD que creamos anteriormente.

Debes haberte fijado que a medida que escribías la librería, la misma iba dándote indicios del resto del nombre a utilizar. Podríamos haber incluido todos los métodos que contiene el paquete, sustituyendo Connection por un asterisco (*), pero esto recarga ineficientemente nuestro código final con fragmentos de métodos de clases que no vamos a utilizar. De la forma que hemos utilizado especificamos solo lo que vamos a necesitar de verdad en el programa.

Continuamos escribiendo código:

public class ConectaBD 

{

    public static Connection conecta()

    {

            Connection conecta=null; 

           try 

              {

                Class.forName("com.mysql.jdbc.Driver"); 

                String servidor="jdbc:mysql://localhost/codejavu";

                String usuario="root";

                String contrasenia="********";

                conecta=(Connection)DriverManager.getConnection(servidor, usuario, contrasenia);

              }

              catch(ClassNotFoundException ex)

              {

                System.out.println(ex.getMessage());

              }

             catch(Exception ex)

             {

                System.out.println(ex.getMessage());                

             }

            finally

            {

               return conecta;

            }

     }

}

OJO.- Recuerda poner la contraseña en la variable contrasenia, ya que los asterisco son solo de ejemplo. Debes poner la clave con la que el root o el usario que sea puede entrar la Base de Datos.

Con esto hemos terminado con nuestra programación de la clase ConectaDB. Ahora vamos a modificar nuestro programa index.jsp en el cual importaremos nuestra clase utilizando el siguiente comando:      <%@page import="com.tutorialesJosem.MySQL.ConectaBD"%>

Fíjate que hemos indicado el nombre del paquete completo en donde se encuentra la clase alojada e incluido el nombre de esta en el comando. Recuerda que para que una pagina jsp acepte comandos java, los mismos deben estar entre la etiquetas especiales <% y %>.

Veamos la siguiente pantalla con el comando ya escrito en el código:

Ahora comprobemos que tenemos conexión con la base de datos, para ello escribe dentro de index.jsp lo que se muestra en la siguiente imagen, recuerda escribir el código dentro de las etiquetas para poder enviar el mensaje.

Te reproduzco el código aquí debajo en caso de que tengas algún problema escribiéndolo.

        <%

            if(ConectaBD.conecta()!=null)

            {

            %>

            Conectado a la Base de Datos, a trabajar!
   

            <%

            } 

            else    

            {

            %>

            Hubo un error al conectar, revisa los parametros!

            <%

            }    

        %>

Ahora vamos a probar la conexión, a la base de datos, así que vamos a correo el archivo index.jsp

ubícate sobre el archivo index.jsp como se indica en la siguiente pantalla, pulsa el botón derecho del ratón y en el menú contextual escoge la opción Run File.

Esperas unos segundos y en el explorador que estés utilizando se abrirá una nueva ventana con una pagina similar a la que vemos en la siguiente imagen:

Fíjate que se ha conectado correctamente. Si no te ha salido revisa la contraseña que escribiste o el usuario si es distinto a root, suelen ser la causa de que no se conecte.

Esta es una forma de dejar abierta la conexión con la Base de Datos, lo cual no es muy recomendable en ciertas ocasiones. Este tipo de conexión es aceptable para sesiones rápidas de consulta, donde el programa se terminará casi de inmediato, pero lo normal es cerrar la conexión una vez hemos realizado las consulta o transacción que necesite tener abierta la conexión.

En nuestro caso no hacemos nada con lo cual, la conexión a quedado abierta! Como corregir esto ahora que hemos estado escribiendo un buen rato?

Muy sencillo!

Solo tenemos que añadir la siguiente linea de código para cerrarla.

ConectaBD.conecta().close();

Y donde la vamos a escribir? Pues en index.jsp, luego de haber abierto la conexión y haber obtenido el mensaje de éxito al conectar. Fíjate en la imagen.

Con lo anterior ya queda terminado el tutorial.

Ahora para aquellos que  nos gusta mirar otras alternativas, vemos esta otra forma de haber definido la variable conecta. (Ojo.- Observa que conecta es una variable mientras que conecta() es un método, )

Aquí vemos que la variable conecta, la hemos definido e inicializado, dentro del método public static Connection conecta()

Podemos hacer que la variable conecta sea una variable static para la clase y como public la haríamos visible para fuera del ámbito de la clase, y al mismo tiempo puede ser utilizada por el método conecta().

Veamoslo, aqui puedes puedes ver la nueva ubicación de la sentencia de definición e inicialización de la variable conecta.

Como vemos hemos movido toda la sentencia fuera del método conecta() y la variable conecta ha pasado a ser un atributo de la clase ConectaBD.

Ahora podemos acceder a esta variable desde nuestro index.jsp añadiendo la siguiente sentencia:

ConectaBD.conecta.close();

Como vemos en la suigente imagen:

Hago la salvedad que la sentencia comentada con // funcionaria igualmente, con el cambio que se hizo de sitio de la variable. 

Sin embargo esta ultima sentencia no funcionaría si dejáramos la definición de la variable conecta dentro del método conecta().