Показать изображение в виде байта [] из базы данных как графическое изображение на странице JSF

У меня есть контент изображения как byte[] из базы данных.

private byte[] image;

Как я могу показать этот массив байтов как реальное графическое изображение на странице JSF?

Ответы

Ответ 1

Это невозможно напрямую с <h:graphicImage>. Он может указывать только на URL, а не на byte[] и InputStream. В принципе, вам нужно убедиться, что эти байты напрямую доступны как HTTP-ответ по данному URL-адресу, который затем можно использовать в <h:graphicImage> (или даже в обычном HTML <img>).

При условии, что вы идентифицируете изображение по его идентификатору, например:

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

Вот пример запуска такого сервлета:

@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());
    }

}

Более продвинутый абстрактный шаблон для сервлета статического ресурса, поддерживающий кеширование HTTP, можно найти в этом ответе, а также конкретный пример для обслуживания из базы данных.

Если вы используете библиотеку служебных программ JSF OmniFaces в среде JSF 2.2 + CDI, вы можете вместо этого использовать ее <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);
    }

}

Ответ 2

Просто привяжите одну переменную String к изображению в пользовательском интерфейсе.

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

Например, вы загружаете байт изображения [] из базы данных, а затем сначала кодируете его в base 64 String.

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