在 JSF 数据表中显示来自 MySQL 数据库的图像 [关闭]

Posted 2023-02-22

【中文标题】在 JSF 数据表中显示来自 MySQL 数据库的图像 [关闭]

【英文标题】：Displaying images from MySQL database in JSF datatable [closed]

【发布时间】：2013-05-31 20:13:09

【问题描述】：

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

【问题讨论】：

你试过什么？为什么它不起作用？你的确切错误是什么？您是否尝试过仅将其显示在页面而不是表格中？

可能重复Link

@Aquillo ：是的，我试过了，但似乎 Primefaces 标记 <p:graphicImage> 需要图像的 url，它不接受从数据库中流式传输 blob

试试这个java.dzone.com/articles/dynamic-images-primefaces

【参考方案1】：

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

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

指的是StreamedContent 属性。

然而，这有一个缺陷，特别是在用于迭代组件（如数据表）时：getter 方法将被调用两次；第一次是JSF自己生成<img src>的URL，第二次是webbrowser需要根据<img src>中的URL下载图片内容的时候。为了提高效率，您不应该在第一个 getter 调用中访问数据库。此外，要参数化 getter 方法调用，以便您可以使用传递特定图像 ID 的通用方法，您应该使用<f:param>（请注意，传递方法参数的 EL 2.2 功能根本不起作用，因为这不会以 <img src>! 的 URL 结束。

总结，应该这样做：

<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 显然返回数据库中图像的唯一标识符（主键），因此 不是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 在 bytes 属性上带有一个 @Lob（当您使用 JSF 时，我当然假设您正在使用 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);
    

另见：

Display dynamic image from database with p:graphicImage and StreamedContent

【讨论】：

非常感谢。它对我有很大帮助

【参考方案2】：

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

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

【讨论】：

就是这样，不幸的是我正在使用 Primefaces，它不提供像 RichFaces 这样的组件。我找到了一些教程，建议定义一个 Servlet 来返回你所说的 blob……我只是发布这个问题，看看是否有可能以另一种方式做到这一点。感谢任何方式:)