在JSF页面中将图像作为byte []显示为图形图像

时间:2015-06-02 21:01:07

标签: image jsf bytearray

我的数据库中的图像内容为private byte[] image;

if ($url == '/login') {
    include('pages/headers/login_post.php');
}

// now we can safely start the DOM output
include('themes/main.php');

如何在JSF页面中将该字节数组显示为真实的图形图像?

2 个答案:

答案 0 :(得分:8)

<h:graphicImage>无法直接实现这一点。它只能指向一个网址,而不能指向byte[]InputStream。基本上,您需要确保这些字节可以直接作为给定URL上的HTTP响应使用,然后您可以在<h:graphicImage>中使用(甚至是纯HTML <img>)。

前提是您通过ID识别图像,如下所示:

<h:graphicImage value="/image/#{someBean.imageId}" />

以下是这种servlet的启动示例:

@WebServlet("/image/*")
public class ImageServlet extends HttpServlet {

    @EJB
    private ImageService service;

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        Long id = Long.valueOf(request.getPathInfo().substring(1));
        Image image = service.find(id);
        response.setContentType(getServletContext().getMimeType(image.getName()));
        response.setContentLength(image.getBytes().length);
        response.getOutputStream().write(image.getBytes());
    }

}

可以在this answer中找到支持HTTP缓存的静态资源servlet的更高级抽象模板,以及从数据库提供服务的具体示例。

如果您碰巧在JSF 2.2 + CDI环境中使用JSF实用程序库OmniFaces,那么您可以使用其<o:graphicImage>来更直观地使用它。

<o:graphicImage value="#{imageBean.getBytes(someBean.imageId)}" />

@Named
@ApplicationScoped
public class ImageBean {

    @EJB
    private ImageService service;

    public byte[] getBytes(Long imageId) {
        return service.getImageBytes(imageId);
    }

}

答案 1 :(得分:1)

只需将一个String变量绑定到UI上的图像即可。

<img src="data:image/png;base64, "#{imageString}">

例如,您要从数据库加载图像字节[],然后首先将其编码为base 64 String。

String imageString= new String(Base64.encodeBase64(byte array fetched from database));