Display p: fileupload Bild in p: graphicImage Vorschau ohne es zu speichern

Ich benutze PrimeFaces 5.3<p:fileUpload> um ein PNG-Bild hochzuladen und ich möchte eine Vorschau davon in @ zeig<p:graphicImage> vor dem Speichern in der Datenbank.

Hier ist ein MCVE:

<h:form enctype="multipart/form-data">
    <p:fileUpload value="#{bean.uploadedFile}" mode="simple" />
    <p:graphicImage value="#{bean.image}" />
    <p:commandButton action="#{bean.preview}" ajax="false" value="Preview" />
</h:form>

private UploadedFile uploadedFile;

public UploadedFile getUploadedFile() {
    return uploadedFile;
}

public void setUploadedFile(UploadedFile uploadedFile) {
    this.uploadedFile = uploadedFile;
}

public void preview() {
    // NOOP for now.
}

public StreamedContent getImage() {
    if (uploadedFile == null) {
        return new DefaultStreamedContent(); 
    } else {
        return new DefaultStreamedContent(new ByteArrayInputStream(uploadedFile.getContents()), "image/png"); 
    }
}

Auf der Backing-Bean tritt kein Fehler auf, und das Bild wird im Front-End nicht geladen und angezeigt. Der Client erwähnt, dass das Bild einen Fehler 404 nicht gefunden zurückgegeben hat.

Antworten auf die Frage(2)

Ihre Antwort auf die Frage