Alternative für p: graphicImage, die Bilder von Byte [] anzeigen und Browser-Cache steuern kann

Question

Es scheint einen Fehler mit p:graphicimage zu geben, wenn Sie die Update-Funktionalität verwenden. Das Laden eines Bildes über value="#{myController.myStreamedContent}" funktioniert, aber beim Ändern von myController.myStreamedContent gefolgt von der Aktualisierung p:graphicimage bleibt das zuvor geladene Bild unverändert. Es gibt die Möglichkeit, cache="false" einzustellen, aber das funktioniert nicht in meinem Firefox 45.0. Ich benutze PrimeFaces 5.3.

Die folgenden Seiten erwähnen auch dies:

• PRIMEFACES - How to refresh a from clicking a ?
• Primefaces : GraphicImage does not refresh
• Why can't I update a p:graphicImage twice after upload a file with p:uploadFile

Gibt es Alternativen, die p:graphicimage ähnliche oder gleiche Funktionalität zur Verfügung stellen? Ich muss im Grunde in der Lage sein, Bilder anzuzeigen, die als byte[] in einem MEDIUMBLOB gespeichert sind.

Answer 1

JSF-Dienstprogramm-Bibliothek OmniFaces hat eine <o:graphicImage>, die technisch eine bessere Arbeit beim Streaming und Caching der Bilder leistet. Es ruft nicht die Getter-Methode twice auf, sondern nur einmal, wenn der Browser das Bild wirklich herunterladen muss. Es unterstützt auch die Verwendung eines byte[] oder InputStream ohne die Notwendigkeit eines Wrappers. Alles in allem ergibt sich ein klareres Modell.

@Named 
@ApplicationScoped 
public class ImageStreamer { 

    @Inject 
    private ImageService service; 

    public byte[] getById(Long id) { 
     return service.getContent(id); 
    } 

} 

<o:graphicImage value="#{imageStreamer.getById(bean.image.id)}" /> 

Es standardmäßig zwingt den Browser das Bild nicht zwischenspeichern, so wird das Bild bei jeder Anforderung heruntergeladen werden. Aus Effizienzgründen kann das Attribut lastModified festgelegt werden, damit Browser das Bild zwischenspeichern können, solange das Bild unverändert ist (lastModified).

<o:graphicImage value="#{imageStreamer.getById(bean.image.id)}" lastModified="#{bean.image.lastModified}" />