Charger une image créée par une servlet dans une jsp

Version imprimable

20/03/2016, 17h36
Sophiae

Charger une image créée par une servlet dans une jsp

Bonjour à tous,

J'ai un soucis avec le chargement d'une image dans ma jsp.

En faite j'ai une servlet qui récupère les données d'une jsp1, crée une image avec (Jfreechart), et stocke l'image dans un fichier chart.png puis envoie des données calculées dans la JSP2.

Dans la JSP2, je charge l'image créée par la servlet . Le problème est que la JSP2 charge l'image avant l'envoie par la servlet. Donc elle ne retrouve pas l'image.

J'ai essayé de faire un thread.wait (time) dans la servlet avant de rediriger vers JSP2 (le temps l'image se crée) mais ça ne marche pas...

Je vous remercie d'avance pour votre aide :)
21/03/2016, 09h31
OButterlin

Tu pourrais mettre l'url de la servlet qui génère l'image dans ta balise <img src="la_servlet"> et renvoyer le flux de l'image depuis cette servlet.
21/03/2016, 10h46
tchize_

Citation:

Envoyé par Sophiae

servlet qui ... crée une image avec (Jfreechart), ... puis envoie des données calculées dans la JSP2.

Le problème est que la JSP2 charge l'image avant l'envoie par la servlet.

Ce n'est pas possible avec ta description car la JSP2, tu ne rentre dedans que après avoir exécuté la servlet. Donne nous le code de test deux jsps et de ta servlet.

Partie de la servlet qui crée l'image et forward vers la jsp

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
/**************************************Creating graphic to represent markershare*******************/
 
 
		DefaultPieDataset dataset = new DefaultPieDataset(); 
 
		for (int j = 0; j < ListesSalesCompetitor.size(); j++) {
			String name = ListesSalesCompetitor.get(j).getCompetitor().getCompetitorname();
			BigDecimal val = ListesSalesCompetitor.get(j).getSalesamount();
			double vald = val.doubleValue();
			dataset.setValue(name,vald);
		}	
		dataset.setValue("CDSOciety", salesd);
 
		JFreeChart chart = ChartFactory.createPieChart3D("Répartition des parts de marché ",
			    		dataset, true, true, false);
 
		final PiePlot3D plot = (PiePlot3D) chart.getPlot();
        plot.setStartAngle(290);
        plot.setDirection(Rotation.CLOCKWISE);
        plot.setForegroundAlpha(0.5f);
        plot.setNoDataMessage("No data to display");
 
		/*Creating file to save chart, if file exists, it will be deleted*/
 
        File fichier = new File("C:\\Image\\chart.png");
	        try{
	        	if(fichier.exists()){
	            fichier.delete();
	         }
	          if(!fichier.exists()){
	            fichier.createNewFile();
	          }
 
	          ImageEncoder imageEncoder = ImageEncoderFactory.newInstance(ImageFormat.PNG);
	          imageEncoder.encode(chart.createBufferedImage(800,600 ), new FileOutputStream(fichier));
	        }catch(IOException e){
	          System.out.println("Une erreur est survenu lors de la création du fichier contenant l'image du graphique");
	        }
 
		request.setAttribute("somme", TotalSales);
		request.setAttribute("partcds", partcds);
		request.setAttribute("compet", ObjectMarkerShare);
 
		System.out.println("part de marche cds fin =" + partcds);
 
		}
 
		request.getServletContext().getRequestDispatcher("/DisplayMarketShare.jsp").forward(request, response);
	}
 
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
 
	}
}

Page JSP :

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<%@ page pageEncoding="ISO-8859-1"%>
<%@ page
	import="java.util.List, java.util.ArrayList,java.util.Iterator,org.pds.isiad.cds.bean.ObjectMarketShare"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1" />
<title>Part de marché</title>
<link type="text/css" rel="stylesheet" href="MiseEnPage.css" />
</head>
 
<body>
 
	<%@include file="Entete.jsp"%>
	<div id="corps">
		<table>
			<h2>Part de marché</h2>
 
			<tr>
				<c:out value="Montant total des ventes = " />
				<c:out value="${somme} Euros" />
			</tr>
 
			<tr>
				<th>Etablissement de Santé</th>
				<th>Part de marché</th>
			</tr>
 
			<tr>
				<td><c:out value="CDSociety" /></td>
				<td><c:out value="${partcds}" />%</td>
			</tr>
 
			<c:forEach var="market" items="${compet}">
				<tr>
					<td><c:out value="${market.competitorname}" /></td>
					<td><c:out value="${market.marketsharecompetitor}" />%</td>
				</tr>
			</c:forEach>
 
			<img src="C:/Image/chart.png" style="width: 600px; height: 400px; float: Right; margin: 0 5px 2px 0;" alt="" />
		</table>
 
	</div>
 
	<!-- <%@include file="Pied.jsp"%>-->
 
</body>
</html>

Je résume :
Quand je lance l'application pour la première fois (c'est à dire que le fichier n'existait pas auparavant), j' ai aucune image dans ma jsp. Et la deuxième fois la jsp affiche l'image qui a été créée durant la première exécution. Donc il y a un décalage. C'est pour ça que j'ai que la jsp charge l'image avant sa création.

21/03/2016, 11h53
Sophiae

Citation:

Envoyé par tchize_

Ce n'est pas possible avec ta description car la JSP2, tu ne rentre dedans que après avoir exécuté la servlet. Donne nous le code de test deux jsps et de ta servlet.

Oui c'est pour ça que ça me paraît bizarre, mais c'est bien ce qui se passe. :(
21/03/2016, 12h03
tchize_
Bon, y a pas mal de problèmes dans ton code.

D'abord l'utilisation d'un nom unique. Le jour où tu aura plusieurs pages ouvertes / plusieurs utilisateurs ça va être du n'importe quoi, chacun aura un truc qui viens de quelqu'un d'autre. Le nom de fichier doit être unique si tu veux absolument passer par un fichier.

l'utilisation de c:\ dans une balise image: tu demande à ton browser de contourner la jvm pour accéder au fichier. Non seulement pas mal de sécurité dans le borwser vont interdire ça, mais de toutes façons, les clients finaux n'auront pas accès à distance à ce fichier.

Ton FileOutputStream n'est pas fermé dans ta servlet. Ce qui fait que ta jvm garde un handle sur le fichier en attendant le garbage collection, ce qui fait que ton browser n'arrive pas à charger l'image.

Il faut que tu revoir le code de la manière suivante:
- donner un nom unique au fichier que tu crée à chaque fois, stocker quelque part dans ton application une table de ces noms créés. Ne pas oubleir de fermer ton FileOutputStream.
- créer une servlet permettant de télécharger le fichier ayant un nom donné, utiliser la table précédente pour s'assurer la sécurité (histoire d'éviter de créer une servlet qui télécharge n'importe quoi)
- dans ton tag <img> référencer la dite servlet + le nom de fichier, histoire que le browser passe bien par ta servlet
21/03/2016, 13h16
Sophiae
Citation:
Envoyé par tchize_

Bon, y a pas mal de problèmes dans ton code.

D'abord l'utilisation d'un nom unique. Le jour où tu aura plusieurs pages ouvertes / plusieurs utilisateurs ça va être du n'importe quoi, chacun aura un truc qui viens de quelqu'un d'autre. Le nom de fichier doit être unique si tu veux absolument passer par un fichier.

l'utilisation de c:\ dans une balise image: tu demande à ton browser de contourner la jvm pour accéder au fichier. Non seulement pas mal de sécurité dans le borwser vont interdire ça, mais de toutes façons, les clients finaux n'auront pas accès à distance à ce fichier.

Ton FileOutputStream n'est pas fermé dans ta servlet. Ce qui fait que ta jvm garde un handle sur le fichier en attendant le garbage collection, ce qui fait que ton browser n'arrive pas à charger l'image.

Il faut que tu revoir le code de la manière suivante:

donner un nom unique au fichier que tu crée à chaque fois, stocker quelque part dans ton application une table de ces noms créés. Ne pas oubleir de fermer ton FileOutputStream.
créer une servlet permettant de télécharger le fichier ayant un nom donné, utiliser la table précédente pour s'assurer la sécurité (histoire d'éviter de créer une servlet qui télécharge n'importe quoi)
dans ton tag <img> référencer la dite servlet + le nom de fichier, histoire que le browser passe bien par ta servlet
Merci tchize pour votre retour rapide :)

j'ai créé une deuxième servlet, par contre je ne sais pas comment faire pour qu'elle télécharge l'image créée par la première étant donné que dans ma servlet 1 je fais déjà un forward vers ma jsp2
21/03/2016, 13h32
tchize_

la servlet 2 prendra juste un paramètre un identifiant de fichier, que tu transmettre via le tag img du jsp, et servira le contenu binaire de l'image (une simple copie du contenu du ficheir vers le response.getOutputStream() + le header contet-type à définir)

Citation:

Envoyé par tchize_

la servlet 2 prendra juste un paramètre un identifiant de fichier, que tu transmettre via le tag img du jsp, et servira le contenu binaire de l'image (une simple copie du contenu du ficheir vers le response.getOutputStream() + le header contet-type à définir)

Voici le contenu de ma deuxième servlet
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 //@WebServlet("/imageServlet") public class CtrlSendChart extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { File filename = new File("C:\\...\\webapp\\Image\\chart.png"); try { if (!filename.exists()) { } FileOutputStream output = new FileOutputStream(filename); response.getOutputStream(); response.setContentType("image/png"); output.flush(); output.close(); } catch (IOException e) { System.out.println("Une erreur est survenu lors de la création du fichier contenant l'image du graphique"); } } }
et l'appel de cette servlet dans ma JSP2

Code:

<img src="CtrlSendChart/filename.png" alt="">

PS : pour le moment je travaille avec le nom du fichier, après je vais créer la table pour les noms uniques. Mais je n'ai plus d'image.

21/03/2016, 16h02
tchize_

Heu non seulement ta servlet n'écrit pas dans ton response.getOutputStream, ce qui fait que le browser ne reçois rien, mais en plus tu faire un new FileOutputStream ce qui a pour conséquence d'effacer ton image :/

Citation:

Envoyé par tchize_

Heu non seulement ta servlet n'écrit pas dans ton response.getOutputStream, ce qui fait que le browser ne reçois rien, mais en plus tu faire un new FileOutputStream ce qui a pour conséquence d'effacer ton image :/

Dans la servlet :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 FileInputStream fis = null; response.setContentType("image/png"); ServletOutputStream output = response.getOutputStream(); try { fis = new FileInputStream(new File("C:/.../webapp/Image/chart.png")); byte[] buf = new byte[1024]; int i = 0; while ((i = fis.read(buf)) != -1) { output.write(buf, 0, i); } output.flush(); } finally { fis.close(); output.close(); } }
dans la jsp :

Code:

<img src="/CtrlSendChart/CtrlSendChart" alt="">

Dans Web.xml :
Code:

1 2 3 4 5 6 7 8 <servlet> <servlet-name>CtrlSendChart</servlet-name> <servlet-class>org.pds.isiad.cds.uc.analysemarketshare.CtrlSendChart</servlet-class> </servlet> <servlet-mapping> <servlet-name>CtrlSendChart</servlet-name> <url-pattern>/CtrlSendChart</url-pattern> </servlet-mapping>

En faite, il ne fallait pas créer le fichier.png dans le webapp car il n'est pas rechargé une fois que l'appli est lancée.

Donc j'ai la servlet1 qui crée l'image et la stocke dans le C:
Puis la 2ième servlet qui récupère l'image et l'envoie vers la JSP2

Dans Servlet2
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 public class CtrlSendChart extends HttpServlet { protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { OutputStream os = response.getOutputStream(); Path path = Paths.get("C:/.../pds/src/main/ImageTest/"+CtrlEvaluateMartketShare.nomImage); byte[] data = Files.readAllBytes(path); response.setContentType("image/png"); os.write(data); os.flush(); os.close(); } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { } }
Dans JSP2 :

Code:

<img src="/pds/CtrlSendChart"style="width:500px; height: 400px;float:Right;margin:0 5px 2px 0;" alt=""/>