02 Mar2016
Galerie d'images avec JSP Servlet Hibernate
Objectifs :
- Chargement des images (Upload).
- Manipulation des chemins relatifs et absolus.
- Affichage des images dans une page JSP.
- Accès à la base de données avec Hibernate.
Énoncé :
Une société souhaite créer une galerie d'images, pour visualiser la liste de ses employés membres du club sportif (Voir Figure ci-dessous).
Travail à faire :
- Développer la couche accès aux données avec le Framework Hibernate :
- Créer l'entité User caractérisée par : id, nom, prénom et l'image.
- Créer la base de données Galerie sous MySQL.
- Créer le fichier de configuration hibernate.cfg.xml.
- Créer la classe HibernateUtil permettant de créer une sessionFactory.
- Créer l'interface IDao contenant la déclaration des CRUD (create, delete, update, findById et findAll).
- Créer la classe UserImpl qui implémente l'interface IDao.
- Développer la couche présentation :
- Créer une page web jsp permettant de saisir les informations d'un membre :
- Au clic sur le bouton "upload" les informations seront envoyées vers une servlet "FileUploadHandler". Cette dernière permet d'insérer les données dans la base de données et redirige l'utilisateur vers une page permettant d'afficher les informations des membres stockés dans la base de données (Voir Figure 1). On demande d'afficher trois membres par ligne.
- Créer une page web jsp permettant de saisir les informations d'un membre :
Structure du projet
Couche accès aux données
- La entité User
package ma.projet.beans; import javax.persistence.Entity; import javax.persistence.GeneratedValue; import javax.persistence.Id; /** * * @author Lachgar */ @Entity public class User { @Id @GeneratedValue private int id; private String nom; private String prenom; private String image; public User() { } public User(String nom, String prenom, String image) { this.nom = nom; this.prenom = prenom; this.image = image; } public User(int id, String nom, String prenom, String image) { this.id = id; this.nom = nom; this.prenom = prenom; this.image = image; } public int getId() { return id; } public void setId(int id) { this.id = id; } public String getNom() { return nom; } public void setNom(String nom) { this.nom = nom; } public String getPrenom() { return prenom; } public void setPrenom(String prenom) { this.prenom = prenom; } public String getImage() { return image; } public void setImage(String image) { this.image = image; } @Override public String toString() { return "User{" + "id=" + id + ", nom=" + nom + ", prenom=" + prenom + ", image=" + image + '}'; } }
- L'interface IDao
package ma.projet.dao; import java.util.List; /** * * @author Lachgar */ public interface IDao<T> { boolean create(T o); boolean update(T o); boolean delete(T o); T findById(int id); List<T> findAll(); }
- La classe UserImpl
package ma.projet.service; import java.util.ArrayList; import java.util.List; import ma.projet.dao.IDao; import ma.projet.beans.User; import ma.projet.util.HibernateUtil; import org.hibernate.Session; import org.hibernate.Transaction; /** * * @author Lachgar */ public class UserImpl implements IDao<User> { private Session session; private Transaction tx; @Override public boolean create(User o) { session = HibernateUtil.getSessionFactory().openSession(); tx = session.beginTransaction(); session.save(o); tx.commit(); return true; } @Override public boolean update(User o) { session = HibernateUtil.getSessionFactory().openSession(); tx = session.beginTransaction(); session.update(o); tx.commit(); return true; } @Override public boolean delete(User o) { session = HibernateUtil.getSessionFactory().openSession(); tx = session.beginTransaction(); session.delete(o); tx.commit(); return true; } @Override public User findById(int id) { User u = null; session = HibernateUtil.getSessionFactory().openSession(); tx = session.beginTransaction(); u = (User) session.get(User.class, id); tx.commit(); return u; } @Override public List<User> findAll() { List<User> users = new ArrayList<User>(); session = HibernateUtil.getSessionFactory().openSession(); tx = session.beginTransaction(); users = session.createQuery("from User").list(); tx.commit(); return users; } }
- Fichier de configuration (hibernate.cfg.xml)
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE hibernate-configuration PUBLIC "-//Hibernate/Hibernate Configuration DTD 3.0//EN" "http://hibernate.sourceforge.net/hibernate-configuration-3.0.dtd"> <hibernate-configuration> <session-factory> <property name="hibernate.dialect">org.hibernate.dialect.MySQLDialect</property> <property name="hibernate.connection.driver_class">com.mysql.jdbc.Driver</property> <property name="hibernate.connection.url">jdbc:mysql://localhost:3306/galerie?zeroDateTimeBehavior=convertToNull</property> <property name="hibernate.connection.username">root</property> <property name="hibernate.hbm2ddl.auto">update</property> <mapping class="ma.projet.beans.User"/> </session-factory> </hibernate-configuration>
- La classe HibernateUtil
package ma.projet.util; import org.hibernate.cfg.AnnotationConfiguration; import org.hibernate.SessionFactory; /** * @author Lachgar */ public class HibernateUtil { private static final SessionFactory sessionFactory; static { try { sessionFactory = new AnnotationConfiguration().configure().buildSessionFactory(); } catch (Throwable ex) { // Log the exception. System.err.println("Initial SessionFactory creation failed." + ex); throw new ExceptionInInitializerError(ex); } } public static SessionFactory getSessionFactory() { return sessionFactory; } }
La couche présentation
- Page de saisie
<%-- Document : index Created on : 29 févr. 2016, 21:09:46 Author : Lachgar --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Galerie en JSP Servlet - Java web application</title> </head> <body> <div> <h3> Saisir les informations d'un membre </h3> <form action="upload" method="post" name="uploadForm" enctype="multipart/form-data"> <input type="text" name="Nom" placeholder="Nom " value="" /><br/> <input type="text" name="Prenom" placeholder="Prenom " value="" /><br/> <input type="file" name="file" /> <input type="submit" value="upload" /> </form> </div> </body> </html>
- La classe Servlet
package ma.projet.controller; import java.io.File; import java.io.IOException; import java.io.InputStream; import java.util.List; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import ma.projet.beans.User; import ma.projet.service.UserImpl; import org.apache.commons.fileupload.FileItem; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload; /** * * @author Lachgar */ @WebServlet(urlPatterns = {"/FileUploadHandler"}) public class FileUploadHandler extends HttpServlet { private String nom; private String prenom; private String path; private String UPLOAD_DIRECTORY; @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { UPLOAD_DIRECTORY = getServletContext().getRealPath("/").replace("build\\", "") + "ressource" + File.separator + "images"; //process only if its multipart content if (ServletFileUpload.isMultipartContent(request)) { try { List<FileItem> multiparts = new ServletFileUpload( new DiskFileItemFactory()).parseRequest(request); String name = null; for (FileItem item : multiparts) { if (!item.isFormField()) { name = new File(item.getName()).getName(); item.write(new File(UPLOAD_DIRECTORY + File.separator + name)); path = UPLOAD_DIRECTORY + File.separator + name; } else { InputStream input = item.getInputStream(); if (item.getFieldName().equals("Nom")) { byte[] str = new byte[input.available()]; input.read(str); nom = new String(str, "UTF8"); } if (item.getFieldName().equals("Prenom")) { byte[] str = new byte[input.available()]; input.read(str); prenom = new String(str, "UTF8"); } } } //File uploaded successfully UserImpl user = new UserImpl(); user.create(new User(nom, prenom, name)); request.setAttribute("message", "File Uploaded Successfully le nom est :" + nom + " le prenom est :" + prenom); } catch (Exception ex) { request.setAttribute("message", "File Upload Failed due to " + ex); } } else { request.setAttribute("message", "Sorry this Servlet only handles file upload request"); } request.getRequestDispatcher("/result.jsp").forward(request, response); } }
- La page pour afficher les membres (Galerie d'images)
<%-- Document : result Created on : 29 févr. 2016, 21:13:24 Author : Lachgar --%> <%@page import="java.util.List"%> <%@page import="ma.projet.beans.User"%> <%@page import="ma.projet.service.UserImpl"%> <%@page import="java.io.File"%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Galerie en JSP Servlet - Java web application</title> <link href="/css/style.css" rel="stylesheet" type="text/css"/> </head> <body> <div id="result"> <h3>${requestScope["message"]}</h3> <% UserImpl ui = new UserImpl(); List<User> users = ui.findAll(); for (int i = 0; i < users.size(); i++) { %> <div> <figure> <img src="/<%="ressource\\images\\" + users.get(i).getImage()%>" alt="<%= users.get(i).getNom()%>" /> <figcaption><h3><%= users.get(i).getNom() + " " + users.get(i).getPrenom()%> </h3></figcaption> </figure> <%}%> </div> </div> </body> </html>
- Le fichier style.css
/* Created on : 2 mars 2016, 20:52:11 Author : Lachgar */ figure { width: 33%; float: left; margin: 0; text-align: center; padding: 0; }
- Table user
Sélectionnez le fichier à afficher.
|
Nom | Taille | Clics | Téléchargements |
Galerie d'images avec JSP - Hibernate | 318.92 Ko | 2608 | Télécharger |