notification update image

Version imprimable

24/05/2010, 15h22
perloutta

notification update image

bonjour à tous,
mon souci consiste à appeler une servelt qui sert à afficher une image dynamiquement, mais tant de fois l'image est la même donc ça sert à rien de la renvoyer au navigateur tant qu'elle n'a pas changé
c'est pour ça, je veux en premier temps tester si l'image (son nom, son id..n'importe quoi) est modifié, si oui alors une autre requête pour l'afficher sinon on garde l'ancien affichage (ainsi on a gagner quelques ko :) )
bon la première chose qui me vienne à l'esprit est la session
pour commencer,je récupère ma variable mais le hic c'est comment récupérer l'ancienne variable (a laquelle je vais la comparer )??
autre chose, est il différent de faire cette comparaison dans la servlet ou dans la page jsp?

merci d'avance
25/05/2010, 08h00
jowo

Bonjour,

Pourquoi réinventer la roue, elle existe déjà sous la forme d'une méthode portant le nom de "getLastModified".

Par exemple: renvoie la date de la dernière modification du fichier.
25/05/2010, 09h55
perloutta

Bonjour,
bah moi je suis satisfaite de l'autre méthode mais malheureusement on m'exige, afin d'optimiser de ré-afficher l'image seulement si elle est modifié, sinon on garde celle déja affichée :calim2: (économiser en octets) donc en premier temps je dois interroger le serveur s'il y a une nouvelle nouvelle si oui on l'affiche genre ce scénario:
c->s:any update for pic?
s->c:yes
c->s: send me last pic
s->c: send last pic
c->s: any update for pic?
s->c: no
c: keep last display

j'ai pensé aussi d'utiliser ajax mais presque tout les bouts de code que j'ai trouvé tournent autour le refresh des formulaires ( en fait sous des données xml soit text)
25/05/2010, 10h13
jowo

Ma méthode ne t'a pas convaincu?

Tu n'as "qu'à surcharger" la méthode getLastModified de ta servlet.

c->s: GET pictureOne
s->c: SEND Data pictureOne Status 200 Modified:25/05/2010/10:07:13

c->s: GET pictureOne Status 200 If-Modified-Since:25/05/2010/10:07:13

Deux réponses possibles du serveur
s->c: Send Status 304 (Image Pas modifiée): le client ne ré-affiche pas l'image
s->c: SEND Data pictureOne Status 200 If-Modified-Since:25/05/2010/10:11:47
(Image modifiée): le client affiche la nouvelle image

Tout ceci est géré par le navigateur (comportement standard du protocole HTTP)

j'ai fait cet essai la, bon je suis sure que ça manque tas de chose :oops:

Code:

1
2
3
4
5
6
7
8
9
10
11
 lastSlide= list[list.length-1];
    String var= (String) session.getAttribute("lastSlide") ;
    long longvar = 0;
    try{
     longvar = Long.parseLong(var);}
    catch (java.lang.NumberFormatException ex){ System.out.println(ex);}
    boolean anyUpdate;
    anyUpdate= lastSlide.lastModified()== longvar ;
    if (anyUpdate)
    session.setAttribute("lastSlide",lastSlide.lastModified());
 session.setAttribute("anyUpdate", anyUpdate);

Code:

1
2
last slide: <% Long a = (Long)session.getAttribute("lastSlide"); %>
        anyUpdate : <% Boolean b = (Boolean)session.getAttribute("anyUpdate"); %>

maintenant je verrai l'histoire de surchage de getLastModified ;)

salut,
pouvez vous svp jetter un coup d'oeil sur ce code?
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 public long getLastModified(HttpServletRequest request) {return lastSlide.lastModified()/1000*1000;} protected boolean checkIfModifiedSince(HttpServletRequest request,HttpServletResponse response /*,ResourceAttributes resourceAttributes*/) throws IOException { try { long headerValue = request.getDateHeader("If-Modified-Since"); long lastModified = getLastModified(request); if (headerValue != -1) { // If an If-None-Match header has been specified, if modified since // is ignored. if ((request.getHeader("If-None-Match") == null) && (lastModified < headerValue + 1000)) { // The entity has not been modified since the date // specified by the client. This is not an error case. response.setStatus(HttpServletResponse.SC_NOT_MODIFIED); response.setDateHeader("Last-Modified", System.currentTimeMillis()); // Now //response.setHeader("ETag", resourceAttributes.getETag()); return false; } } } catch (IllegalArgumentException illegalArgument) { return true; } return true; }
pleins de trucs ne sont pas claires dans ma tete :weird:
primo comment faire comprendre au serveur d'invoquer cette methode de test periodiquement, ok lors d'une requet..mais lors une requete in lit directement le doGet! alors toute cette bidouille afin d'éviter de lire la doGet pour ne pas ré-afficher l'image
de plus si je va pas appeler ce boolean retourné dans la doGet, alors ou dois-je l'appler
ça c'est d'une part, d'autre part, coté jsp comment doit'on gérer ça?

ça me semble floue en tant que étapes d'exéction :oops:

ne pas toucher à la méthode "checkIfModifiedSince"

La seule méthode à modifier est getLastModified
Code:

1 2 3 4 5 6 7 8 9 protected long getLastModified(HttpServletRequest req) { /* Suppose que lastSlide est une instance de la classe File */ if (lastSlide == null) { return -1; } return lastSlide.lastModified(); }
Ce code n'est qu'une ébauche....

25/05/2010, 15h24
perloutta

merci pour la réponse, mais svp est ce que vous pouvez m'expliquer quand cette méthode sera invoqué? parce que vraiment j'ai mal a comprendre le déroulement du scénario entre client serveur
je pense pas qu'il suffit de surcharger cette méthode et par magie tout fonctionne :mouarf:

merci

encore avec les essais :mouarf:
Code:

1 2 3 4 protected long getLastModified(HttpServletRequest req) { return (lastSlide==null) ? -1 : lastSlide.lastModified(); }
et dans la doGet:
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 ..... long lastModified = getLastModified(request); long ifModifiedSince = request.getDateHeader("If-Modified-Since"); if (ifModifiedSince != -1 && lastModified < ifModifiedSince + 1000) { response.setStatus(HttpServletResponse.SC_NOT_MODIFIED); return; } // Init servlet response.--------------------------------------------------------------- response.reset(); response.setBufferSize(DEFAULT_BUFFER_SIZE); response.setContentType("image/png"); response.setHeader("Content-Length", String.valueOf(lastSlide.length())); response.setHeader("Content-Disposition", "inline; filename=\"" + lastSlide.getName() + "\""); response.setDateHeader("Last-Modified", lastModified); // Prepare streams. BufferedInputStream input = null; BufferedOutputStream output = null; ....
j'espere que je suis un peu plus proche de la bonne solution :calim2:

le souci mnt, que ifModifiedSince prend toujours la valeur -1 donc n'entre jamais dans la boucle if
de plus quelles modifications dois-je apporter coté jsp?
je pense pas que je dois conserver le meme appel de la servlet par le biais de script javascript (concaténation de l'src de l'image avec date/time )

quelques idées? :roll:

merci

27/05/2010, 08h27
jowo

La gestion de l'entête Last-Modified est faite pas la class HttpServlet et on l'a lui laisse.

La méthode service appelle getLastModified pour les méthodes HTTP GET et HEAD.

Pour GET, service va, si getLastModified retourne une valeur différente de -1 et que l'entête "If-Modified-Since" est présente, compare les deux valeurs. Si aucune modification a eu lieu, service retourne le status 304 (Not Modified) sinon elle appelle la méthode doGet.
27/05/2010, 10h03
perloutta

Bonjour,

Citation:

La gestion de l'entête Last-Modified est faite pas la class HttpServlet et on l'a lui laisse.

je pense pas, sinon avec quelle classe?

Citation:

La méthode service appelle getLastModified pour les méthodes HTTP GET et HEAD.

Pour GET, service va, si getLastModified retourne une valeur différente de -1 et que l'entête "If-Modified-Since" est présente, compare les deux valeurs. Si aucune modification a eu lieu, service retourne le status 304 (Not Modified) sinon elle appelle la méthode doGet.

j'ai trouvé un article qui détaille getLastModified:

Citation:

The extra help a servlet can provide is implementing the getLastModified() method. A servlet should implement this method to return the time it last changed its output. Servers call this method at two times. The first time the server calls it is when it returns a response, so that it can set the response's Last-Modified header. The second time occurs in handling GET requests that include the If-Modified-Since header (usually reloads), so it can intelligently determine how to respond. If the time returned by getLastModified() is equal to or earlier than the time sent in the If-Modified-Since header, the server returns the "Not Modified" status code. Otherwise, the server calls doGet() and returns the servlet's output.

donc si j'ai bien compris je vois pas l'interet d'utiliser la méthode service

je suis vraiment bloquée et je commence à douter que cette méthode mène à la bonne solution :calim2:

j'ai fait quelques recherches sur ajax mais je pense pas que ça va aboutir surtout pour les images parce que si ne me trompe pas la réponse est soit text soit xml (DOM)

enfin la galère a eu une fin :mrgreen:

voici le code correct:

la 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
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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package com.pfe.slide;
 
import java.io.BufferedInputStream;
import java.io.BufferedOutputStream;
import java.io.Closeable;
import java.io.File;
import java.io.FileFilter;
import java.io.FileInputStream;
import java.io.IOException;
import java.util.Arrays;
import java.util.Comparator;
import javax.servlet.ServletConfig;
 
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
/**
 *
 * @author jowo
 */
public class SlideServlet extends HttpServlet {
 
  // Constants ----------------------------------------------------------------------------------
  private static final int DEFAULT_BUFFER_SIZE = 10240; // 10KB.
  private static final String IMG_DIRECTORY = "C:\\images";
  private static final int NBR_IMG_KEPT = 2;
  private static final String IMG_ERROR_DIRECTORY = "C:\\error.png";
 
  private static FileFilter ONLY_FILE_FILTER = new FileFilter() {
    @Override
    public boolean accept(File pathname) {
      return pathname.isFile();
    }
 
  };
 
  // Compare la date de modifcation d'un fichier. Les tri est descendant
  private static Comparator<File> MODIFIED_FILE_CMP = new Comparator<File>() {
 
    @Override
    public int compare(File f1, File f2) {
      return (f1.lastModified() == f2.lastModified()) ? 0
                                                      : f1.lastModified() > f2.lastModified() ? -1 : 1;
    }
  };
 
  // Properties ---------------------------------------------------------------------------------
 
  // Actions ------------------------------------------------------------------------------------
//  @Override
//  protected long getLastModified(HttpServletRequest request) {
//    final long result;
//    final File slide;
//    if ((slide = getLastSlide(request)) != null) {
//      result = slide.lastModified();
//    }
//    else {
//      result = -1L;
//    }
//System.out.println("LastModification: " + result);
//    return result;
//  }
 
 
  //---------------------------------------------------------------------------------------------------
  @Override
  protected void doGet(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
 
    final String type = request.getParameter("type");
    if (type != null && "filename".equals(type)) {
      sendFilename(request, response);
    }
    else {
      sendSlide(request, response);
    }
  }
  // fin doGet-------------------------------------------------------------------------------------
 
  private void sendSlide(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
    File slide = getLastSlide();
    if (slide == null) {
      slide = new File(IMG_ERROR_DIRECTORY);
    }
    // Init servlet response.---------------------------------------------------------------
    //response.reset();
    response.setBufferSize(DEFAULT_BUFFER_SIZE);
    response.setContentType("image/png");
    response.setHeader("Content-Length", String.valueOf(slide.length()));
    response.setHeader("Cache-Control", "no-cache");
    response.setDateHeader("Expires", 0);
 
    // Prepare streams.
    BufferedInputStream input = null;
    BufferedOutputStream output = null;
 
    try {
      // Open streams.
      input = new BufferedInputStream(new FileInputStream(slide), DEFAULT_BUFFER_SIZE);
      output = new BufferedOutputStream(response.getOutputStream(), DEFAULT_BUFFER_SIZE);
 
      // Write file contents to response.
      byte[] buffer = new byte[DEFAULT_BUFFER_SIZE];
      int length;
      while ((length = input.read(buffer)) > -1) {
        output.write(buffer, 0, length);
      }
      output.flush();
      System.out.println("Send Slide " + slide.getName());
    }
    catch(IOException ioe) {
      System.out.println("Send Slide IO Error: " + ioe.getMessage());
    }
    finally {
      // Gently close streams.
      close(output);
      close(input);
    }
  }
 
  private void sendFilename(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
    final String paramFilename = request.getParameter("filename");
    final File slide = getLastSlide();
    String filename = (slide != null ? slide.getName() : "");
    if (paramFilename != null && filename != null && filename.equals(paramFilename)) {
      System.out.println("Send Slide Not Modified");
      filename = "";
    }
    filename = "[\"" +filename+ "\"]";
    response.setContentType("application/json");
    response.setContentLength(filename.length());
    response.setHeader("Cache-Control", "no-cache");
    response.setDateHeader("Expires", 0);
    response.getWriter().write(filename);
    response.getWriter().flush();
    System.out.println("Send filename " + filename);
  }
 
  private File getLastSlide() {
    // On rÃ©cupÃ¨re seulement les fichiers du rÃ©pertoire
    final File[] list = new File(IMG_DIRECTORY).listFiles(ONLY_FILE_FILTER);
    // Trie par ordre dÃ©croissant les dates de la derniÃ¨re modification
    Arrays.sort(list, MODIFIED_FILE_CMP);
 
    //
    File slide = null;
    if (list.length > 0) {
      // Le fichier le plus jeune est en premiÃ¨re position
      slide = list[0];
 
      //delete old images
      for (int i = list.length-1; i >= NBR_IMG_KEPT; --i) {
        list[i].delete();
      }
    }
    return slide;
  }
 
  // Helpers (can be refactored to public utility class) ----------------------------------------
  private static void close(Closeable resource) {
    if (resource != null) {
      try {
        resource.close();
      }
      catch (IOException e) {
        // Do your thing with the exception. Print it, log it or mail it.
        e.printStackTrace();
      }
    }
  }
}

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
56
57
58
<%--
    Document   : slider
    Created on : 18 mai 2010, 13:38:14
    Author     : jowo
--%>
 
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
 
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Conference's slides</title>
        <script type="text/javascript" charset="UTF-8" src="http://code.jquery.com/jquery-1.4.2.js"></script>
    </head>
 
    <body>
        <img id="slider" src="<%=request.getContextPath()%>/SlideServlet" alt="slider">
        <br>
        RUN <input type="checkbox" id="flagRun" checked="checked"/> Hello ! The time is now   <%=new java.util.Date()%>
 
       <script type="text/javascript">
            var img = document.getElementById("slider");
            var $run = null;
            if (img) {
                var srcImage = img.src;
                var fct = function() {
                    var flagRun = $run.is(":checked");
                    if (!flagRun) {
                      return;
                    }
                    var fn = img.fn || "";
                    var params = {"type":"filename",
                                  "filename": fn};
                    jQuery.getJSON(srcImage, params, function(data, status) {
                        window.console.log("Response Filename " + status); 
                        if (status == "success") {
                          var filename = data[0] || "";
                          if (filename != "") {
                            img.fn = filename;
                            window.console.log("Filename: " + data[0] || ""); 
                            img.src = srcImage+ "?_=" + new Date().getTime() +
                              "&type=slider";
                          }
                        }
                    });
                };
            }
            jQuery(function() {
              $run = $("#flagRun");
              setInterval(fct, 2500);
            });
        </script>
 
 
    </body>
</html>

un grand grand merci à jowo pour son aide incontestable, il est le meilleur :ccool: