在JSF数据表中显示来自MySQL数据库的图像

时间:2013-06-05 08:08:20

标签: mysql image jsf primefaces datatable

我有MySQL数据库,可以将图像存储在blob列中。我想在PrimeFaces <p:dataTable>中展示它们。我怎样才能做到这一点?

2 个答案:

答案 0 :(得分:12)

您可以使用<p:graphicImage>显示存储在byte[]中的图像,而不管byte[]源(数据库,磁盘文件系统,网络等)。最简单的例子是:

<p:graphicImage value="#{bean.streamedContent}" />

引用StreamedContent属性。

但这有一个缺陷,特别是在迭代组件(如数据表)中使用时:getter方法将被调用两次; JSF本身第一次生成<img src>的URL,第二次是webbrowser,需要根据<img src>中的URL下载图像内容。为了提高效率,您不应该在第一次getter调用中击中DB。另外,要参数化getter方法调用以便您可以使用传递特定图像ID的通用方法,您应该使用<f:param>(请注意,传递方法参数的EL 2.2功能将不起作用所有这些都不会以<img src>的网址结束!)。

总结,这应该做:

<p:dataTable value="#{bean.items}" var="item">
    <p:column>
        <p:graphicImage value="#{imageStreamer.image}">
            <f:param name="id" value="#{item.imageId}" />
        </p:graphicImage>
    </p:column>
</p:dataTable>

#{item.imageId}显然会返回DB(主键)中图像的唯一标识符,因此 byte[]内容。 #{imageStreamer}是一个应用程序范围的bean,如下所示:

@ManagedBean
@ApplicationScoped
public class ImageStreamer {

    @EJB
    private ImageService service;

    public StreamedContent getImage() throws IOException {
        FacesContext context = FacesContext.getCurrentInstance();

        if (context.getCurrentPhaseId() == PhaseId.RENDER_RESPONSE) {
            // So, we're rendering the HTML. Return a stub StreamedContent so that it will generate right URL.
            return new DefaultStreamedContent();
        } else {
            // So, browser is requesting the image. Return a real StreamedContent with the image bytes.
            String imageId = context.getExternalContext().getRequestParameterMap().get("imageId");
            Image image = imageService.find(Long.valueOf(imageId));
            return new DefaultStreamedContent(new ByteArrayInputStream(image.getBytes()));
        }
    }

}

Image类在此特定示例中只是@Entity @Lob bytes属性(因为您使用的是JSF,我的cource假设您'使用JPA与数据库进行交互。)

@Entity
public class Image {

    @Id
    @GeneratedValue(strategy = IDENTITY) // Depending on your DB, of course.
    private Long id;

    @Lob
    private byte[] bytes;

    // ...
}

ImageService只是一个标准的@Stateless EJB,这里没什么特别的:

@Stateless
public class ImageService {

    @PersistenceContext
    private EntityManager em;

    public Image find(Long id) {
        return em.find(Image.class, id);
    }

}

另见:

答案 1 :(得分:-1)

如果您使用的是Richfaces,则可以使用a4j:mediaOutput组件从bean中流式传输blob。

如果情况并非如此,我恐怕我不熟悉Primefaces。如果它没有提供任何组件,则需要一种生成指向返回blob的servlet的URL的方法。这样,您就可以将h:graphicImage与自动生成的网址一起使用。