Afficher une image depuis une BDD dans une page JSF

Version imprimable

13/01/2015, 01h23
layloun

Afficher une image depuis une BDD dans une page JSF

Bonjour à tous,
j'ai une application jee7 avec jpa et jsf comme framework, netbeans comme IDE et Glassfish comme serveur d'application, j'ai une table dans ma BDD (derby) qui s'appelle Événement id, titre et image comme attributs je veux afficher les détailles d'un événement quelqu'un peut m'aider comment je peux récupérer l'image de la BDD et l'afficher dans la page JSF.
merci d'avance
13/01/2015, 15h26
Pill_S

En gros:

1) définir une servlet qui sera chargée du rendu de l'image
2) dans le doGet de la servlet, récupérer l'id de l'image à afficher (via paramètre get)
3) setter un content-type correspondant au type d'image dans la réponse
4) en utilisant ton dao jpa, récupérer la données de l'image
5) écrire ces données dans la réponse

ça, ça permet d'afficher une image

ensuite, dans les templates d'affichage (html probablement), tu mets une référence à la servlet dans la balise img: <img src="/myservlet?id=1234" alt="" />

Salut,

Un petit exemple de Servlet qui fait le boulot.

En reprenant le code de @Pill_S <img src="/myservlet?id=1234" alt="" />.

Code:

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
 
public void doGet( HttpServletRequest request, HttpServletResponse response )
			 throws ServletException
{
	String fileName = request.getParameter( "id" );
 
	InputStream is = getMyFileInputStream( fileName ); // Ici à toi de voir comment tu peux récupérer un InputStream à partir de ta base de donnée.
	OutputStream os = null;
 
	try
	{
		os = response.getOutputStream();
		response.setContentType( MimeType.getMimeType( fileName ) ); // Ici c'est une classe perso qui me sert à récup le Type Mime à partir d'une extension de fichier
 
		byte[] buffer = new byte[ 512 ];
 
		for( int length = 0; ( length = is.read( buffer ) ) > 0; )
			os.write( buffer, 0, length );
 
		os.flush();
	}
	catch( Exception e )
	{
		e.printStackTrace();
	}
	finally
	{
		if( os != null )
			os.close();
 
		if( is != null )
			is.close();
	}
}

Reste à voir comment récupérer le contenue de ton image dans ta BDD, mais ça je te laisse faire ;)

13/01/2015, 16h45
Pill_S

mouais, sauf le catch, il ne faut pas faire printStackTrace mais propager l'exception, éventuellement wrappée dans une ServletException. comme ça, ça remonte en tant qu'erreur http 500 dans le client
13/01/2015, 16h53
Nico02

Oui en effet :oops:

J'ai vite fait modifié une Servlet que j'avais sous la main pour l'exemple mais dans mon cas j'ai des traitements dans le catch. du coup j'ai bêtement mit un printStackTrace() :aie:
13/01/2015, 18h06
Logan Mauzaize

Pour le type mime, on peut se baser sur FileTypeMap
14/01/2015, 09h50
Nico02

Le problème de FileTypeMap c'est qu'il est plus que limité..

Si ne sait gérer que quelques format les plus courant. Et encore, quand je dis courant, pour un .png il va renvoyer "application/octet-stream"..

Il semblerait qu'ils aient fait des progrès: http://docs.oracle.com/javase/7/docs...leTypeMap.html, avec activation.jar dans le classpath, ça fait ça:
Code:

1 2 3 4 5 6 7 8 9 10 11 import javax.activation.MimetypesFileTypeMap; public class Temp { public static void main(String[] args) { System.out.println(MimetypesFileTypeMap.getDefaultFileTypeMap() .getContentType("toto.png")); } } --> "image/png"

14/01/2015, 11h19
Logan Mauzaize
En effet ... Il me semblait que c'est ce que j’utilisais ... A moins que Tomcat viennent avec une définition des types mime ?
J'ai retrouvé : ServletContext.getMimeType

EDIT: S'il en manque, il suffit d'ajouter une balise "mime-mapping" dans le "web.xml" :
Code:

1 2 3 4 <mime-mapping> <extension>png</extension> <mime-type>image/png</mime-type> </mime-mapping>
Sinon depuis Java 7, il y a Files.probeContentType.
Exemple:
Code:

1 2 3 for (String ext : Arrays.asList(".xml", ".png", ".jpg", ".js")) { System.out.printf("%-5s => %s%n", ext, Files.probeContentType(new File(ext).toPath())); }
14/01/2015, 11h30
Nico02

Voici la liste des formats supporté par activation.jar

Citation:

text/html html htm HTML HTM
text/plain txt text TXT TEXT
image/gif gif GIF
image/ief ief
image/jpeg jpeg jpg jpe JPG
image/tiff tiff tif
image/png png PNG
image/x-xwindowdump xwd
application/postscript ai eps ps
application/rtf rtf
application/x-tex tex
application/x-texinfo texinfo texi
application/x-troff t tr roff
audio/basic au
audio/midi midi mid
audio/x-aifc aifc
audio/x-aiff aif aiff
audio/x-mpeg mpeg mpg
audio/x-wav wav
video/mpeg mpeg mpg mpe
video/quicktime qt mov
video/x-msvideo avi

Ça va pas péter très loin quand même.

Après il est tout à fait possible de fournir son propre fichier à MimetypesFileTypeMap avec son propre mapping.

Au final je me rend compte que j'ai un peu réinventé la roue, puisque sur le fond je fais exactement comme lui..

Edit : Par contre je prend note pour le mapping dans Tomcat, même si je trouve ça un peu lourd a écrire (ça peu vite polluer le web.xml)
14/01/2015, 13h38
Logan Mauzaize

Citation:

Envoyé par Nico02

Edit : Par contre je prend note pour le mapping dans Tomcat, même si je trouve ça un peu lourd a écrire (ça peu vite polluer le web.xml)

Celui de Tomcat est déjà bien fourni : Tc6/conf/web.xml
14/01/2015, 13h44
Nico02

Oui j'ai vu ça juste après avoir poster :aie:
16/01/2015, 01h00
layloun

Merci bien pour toutes vos réponses mais j'ai oublié de marquer que je suis débutante en jee donc de ce que vous parlez me semble un peu avancé .pouvez vous me proposer des tutoriels.
16/01/2015, 10h50
Logan Mauzaize
Pour afficher une image, il te faut une servlet (sais-tu ce que c'est ?) qui permettra de récupérer l'image via une requête vers ton serveur (exemple d'URL http://serveur.com/application/images/evenements.png?id=1, la servlet devra être mappé sur le "url-pattern" : "images/evenements/*").

Dans ta page JSF, il te faudra insérer <h:graphicImage value="./images/evenements/image.#{evenement.image.ext}?id=#{evenement.id}" />
La servlet qui servira les images doit :
- Définir la méthode doGet pour répondre aux requêtes GET du client
- Récupérer l'identifiant de l'événement via HttpServletRequest.getParameter
- Te débrouiller ensuite pour récupérer le flux binaire (ou la totalité des octets) associé à l'événement
- Spécifier le type de contenu de la réponse via HttpServletResponse.setContentType (en s'aidant de ServletContext.getMimeType pour récupérer le type MIME).
- Il est recommandé mais pas nécessaire de spécifier également la taille (en octet de l'image) via HttpServletResponse.setContentLength
- Ensuite envoyer l'image via HttpServletResponse.getOutputStream
Si tu as peu de connaissance en développement Web avec Java, je te conseille le cours Java "Le développement d'applications web".