在 JSF 中将 InputStream 显示为动态图像答案

【问题标题】：Show an InputStream as dynamic image in JSF在 JSF 中将 InputStream 显示为动态图像
【发布时间】：2016-02-17 17:07:10
【问题描述】：

我们如何使用 OmniFaces 在 JSF 2.0 中嵌入和显示 InputStream 作为动态图像？

【问题讨论】：

标签： jsf-2 inputstream omnifaces graphicimage

【解决方案1】：

OmniFaces 尚未为此提供任何实用程序。

如果图像文件位于磁盘文件系统上，那么您需要在 servletcontainer 配置中创建一个虚拟上下文，以便可以通过普通 URL 访问它们。另见Load images from outside of webapps / webcontext / deploy folder using <h:graphicImage> or <img> tag。

如果图像文件存储在数据库中，那么您需要创建一个简单的 servlet，它将图像的InputStream 从数据库写入 HTTP 响应的OutputStream。另请参阅How to retrieve and display images from a database in a JSP page?（请注意，这不需要 JSP/HTML，您可以使用 <h:graphicImage>，因为它只生成一个 HTML <img> 元素）。

有 PrimeFaces <p:graphicImage>，但实现起来有点不直观。另见Display dynamic image from database with p:graphicImage and StreamedContent。

更新：由于 OmniFaces 2.0（用于 JSF 2.2）有一个 <o:graphicImage> 组件，它支持直接引用 byte[] 或 InputStream 属性在直观的方式如下：

<o:graphicImage value="#{imageStreamer.getById(bean.imageId)}" />

@Named
@ApplicationScoped
public class ImageStreamer {

    @Inject
    private ImageService service;

    public InputStream getById(Long id) { // byte[] is also supported.
        return service.getContent(id);
    }

}

与 PrimeFaces <p:graphicImage> 不同，不需要 <f:param> 并且在渲染响应阶段评估 EL 方法参数，但 EL 方法本身仅在浏览器实际请求图像时调用。另见the showcase 和the blog on the subject。

【讨论】：