预览期间找不到基于上传文件创建的 StreamedContent

Question

我在 jsf 页面上创建了文件上传对话框和图片库。每张图片上传后，画廊应该显示所有到目前为止上传的图片。图像将存储在后端 bean 中，并且应该由图库从后端 bean 动态获取。出于某种原因，图库显示了上传的图片标签，但没有显示引用图片，因为找不到图片资源。

我使用 spring，在 tomcat 上使用 primefaces。提前感谢您的帮助！

我的 JSF 页面：

<p:fileUpload id="imageUpldoad" update="galleryPanel" fileUploadListener="#{wizzardBean.handleFileUpload}" mode="advanced" dragDropSupport="true" 
              sizeLimit="10000000"  multiple="true" auto="false" fileLimit="100" allowTypes="/(\.|\/)(gif|jpe?g|png)$/" />


<p:panel id="galleryPanel">
   <p:galleria id="gallery" value="#{wizzardBean.getHotelImages()}" var="img" panelWidth="500" panelHeight="313" showCaption="true" rendered="#{wizzardBean.showGallery()}">
        <p:graphicImage name="#{img.name}" value="#{wizzardBean.hotelImage}" alt="Image Description for #{img.name}" title="#{img}">
            <f:param id="imgId" name="imgId" value="#{img.id}" />
        </p:graphicImage>
</p:galleria>

我的后端 Bean：

public class WizzardBean extends BaseBean {
    private List<HotelImage> hotelImages;

    public void handleFileUpload(FileUploadEvent event) throws IOException {
        if (event.getFile() != null) {
            HotelImage hotelImage = new HotelImage(hotelImages.size(), event.getFile().getFileName(), event.getFile());
            hotelImages.add(hotelImage);
        }
    }



    public StreamedContent getHotelImage() {
        ExternalContext externalContext = FacesContext.getCurrentInstance().getExternalContext();
        String photoId = externalContext.getRequestParameterMap().get("imgId");
        if (photoId == null || photoId.equals("")) {
            return null;
        } else {
            int parsedId = Integer.parseInt(photoId);
            return hotelImages.get(parsedId).getImage();
        }
    }
}

酒店形象class:

public class HotelImage {

private int id;
private String name;
private StreamedContent image;

public HotelImage(int id, String name, UploadedFile file) {
    this.id = id;
    this.name = name;
    try {
        image = new DefaultStreamedContent(file.getInputstream(), "image/jpg");
    } catch (IOException e) {
    }
}

public int getId() {
    return id;
}

public String getName() {
    return name;
}

public StreamedContent getImage() {
    return image;
}

浏览器说：

<img id="mainFormId:j_idt52:j_idt55" src="RES_NOT_FOUND" alt="Image Description for twitter.png" title="twitter.png">

Answer 1

这种方法有几个问题。这些归结为错误的假设，即上传的文件、InputStream 和 StreamedContent 可以被多次读取和重复使用。这是不正确的。上传的文件只会发送一次，并且只在原始请求期间可用，流创建后只能读取一次。

此外，将特定于 PrimeFaces 的 StreamedContent 甚至 UploadedFile 作为 bean 属性是错误的。 bean 属性至少应该是一个 File 引用服务器本地磁盘文件系统上的物理文件，或者一个 byte[] 代表服务器内存中的原始内容，或者一个 Long 代表数据库中 blob 条目的插入 ID。

你需要调整你的代码，尽快将上传的文件内容保存到一个永久的存储位置它进来然后将结果赋值为一个bean属性类型 File 或 byte[] 或 Long。然后，让其余代码使用该 bean 属性而不是在 getter 方法中创建一个 StreamedContent。绝对不要将 StreamedContent 分配给另一个 bean 属性.

您可以在下面链接的问题的答案中找到具体而详尽的示例。

How to save uploaded file in JSF
Display dynamic image from database or remote source with p:graphicImage and StreamedContent

预览期间找不到基于上传文件创建的 StreamedContent

StreamedContent created based on uploaded file is not found during preview

jsf

file-upload

primefaces