[AJAX] Image Dynamique en AJAX et servlet JAVA

**Canary3d** · 28/02/2008, 10h45

Bonjour,
Voici mon pb :
Je voudrais afficher une image g�n�r�e � partir d'un controlleur JAVA via AJAX dans une page HTML

L'image g�n�r�e est de type jpeg.

Je suis d�butant dans le domaine d'ajax, et evidement ce que je fais ne fonctionne pas

Voici le code de mon controleur qui g�n�re l'image et renvoie un flux:
Pour info ce controleur fonctionne tr�s bien puisque cela fonctionne tr�s bien en mode "non-AJAX".

Ce qui m'interresse c'est de savoir si la d�finition de "response" est bonne (setHeader) et si il ne manque pas kke chose pour un fonctionnement AJAX

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
    public ModelAndView handleRequest(HttpServletRequest request,
			HttpServletResponse response) throws WebmapException,
			ServletException, IOException, ClassNotFoundException {
 
		if (log.isDebugEnabled()) {
			log.debug("**/ Affichage de la map /**");
		}
    	session = request.getSession();
    	map = (mapObj) session.getAttribute("Map");
   		if (log.isDebugEnabled()) {
   			log.debug("Current Scale :\t " + Double.toString(map.getScaledenom()));
   		}
   		response.setHeader("Pragma","no-cache");
   		//response.setHeader("Content-Type", "application/x-www-form-urlencoded");
   		//response.setIntHeader("Expires",-1);
   		response.setHeader("Content-Type", "image/jpeg");
		response.getOutputStream().write(cartoService.renderMap(map).getBytes());
   		response.getOutputStream().flush();
   		response.flushBuffer();
   		return null;
    }

voici maintenant ma page html avec l'appel � la servlet ("genererImage.html") qui execute le controleur (voir ci-dessus) :

2) Est ce que la m�thode utilis�e pour affecter le contenu du flux � la source (src) de mon image est la bonne ?

3) Y a t il une m�thode sp�cifique pour r�cup�rer la "response" avec un autre format que text (responseText) ou XML (responseXML) ?

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

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
56
 
<%@ include file="/inc/admin_include.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language="JavaScript">
	function submitForm()
	{ 
		var req = null; 
 
		document.ajax.dyn.value="Started...";
 
		if(window.XMLHttpRequest) {// Firefox   
			req = new XMLHttpRequest();   
		} else if(window.ActiveXObject) {// Internet Explorer   
			req = new ActiveXObject("Microsoft.XMLHTTP");   
		} else { // XMLHttpRequest non supporté par le navigateur
			alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest... Veuillez Utiliser Internet Explorer ou FireFox");   
			return;   
		}
 
		req.onreadystatechange = function()
		{ 
			document.ajax.dyn.value="Wait server...";
			if(req.readyState == 4)
			{
				if(req.status == 200)
				{
					document.ajax.dyn.value="Image Received";	
					var monImage = document.getElementById('image');
					if (monImage) {
						monImage.src = req.responseXML;
					}	
				}	
				else	
				{
					document.ajax.dyn.value="Error: returned status code " + req.status + " " + req.statusText;
				}	
			} 
		}; 
		req.open("POST", "genererImage.html", true); 
		req.send(null); 
	} 
	</script>
</head>
 
<body>
<FORM name="ajax" method="POST" action="">
 
<p><INPUT type="BUTTON" value="Submit" ONCLICK="submitForm()">
</p>
<p><input type="text" name="dyn" size="32" value=""></p>
<img src="" id="image">
</FORM>
</body>
</html>

Est ce quelqu'un pourrait me dire � quelle endroit je fais une erreur, voire m�me me renvoyer le code source de la solution ?.

merci pour le coup de main !

**jojosbiz** · 29/02/2008, 09h03

Salut,
si c'est bien l'url de l'image que tu renvoies, la m�thode me semble �tre la bonne, � part qu'il faudrait p-e utiliser "responseText" et pas "responseXML".

**Canary3d** · 29/02/2008, 12h04

Non, justement, ce n'est pas l'url mais un flux de type byte[]. Le controleur g�n�re une image et "place" dans le "response" le flux outputStream.

Cette m�thode fonctionne tr�s bien lorsque je n'utilise pas d'ajax et que je fais tout simplement dans une page html :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
<img id="toto" src="genererImage.html">

[AJAX] Image Dynamique en AJAX et servlet JAVA

JavaScript

Discussions similaires

Partager

Partager