title: Display p:fileupload image in p:graphicImage preview without saving it
body: <p>I am using PrimeFaces 5.3 <code>&lt;p:fileUpload&gt;</code> to upload a PNG image and I would like to show a preview of it in <code>&lt;p:graphicImage&gt;</code> before saving in database.</p>
  
  <p>Here's a MCVE:</p>
  
  <pre><code>&lt;h:form enctype="multipart/form-data"&gt;
      &lt;p:fileUpload value="#{bean.uploadedFile}" mode="simple" /&gt;
      &lt;p:graphicImage value="#{bean.image}" /&gt;
      &lt;p:commandButton action="#{bean.preview}" ajax="false" value="Preview" /&gt;
  &lt;/h:form&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>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"); 
      }
  }
  </code></pre>
  
  <p>No error occurring on the backing bean, and the image won't be load and display at front-end. The client mentions that the image returned a 404 not found error.</p>