CODEWITHSUNDEEP
javahibernatejspspring-mvcimage-uploading
MJM
MJM

Reputation: 141

Convert byte[] to image and display on jsp

I'm trying to display an uploaded picture (which is now a byte array) on a jsp page. Now, the byte[] column exists in the database and has to be converted to an image.

This is what I've been trying:

Part of the table on jsp page:

<c:forEach var="user" items="${userList}">
    <tr>
        <td>${user.fileName}</td>
        <td>
            <img src="data:image/jpg;base64,${user.imageFile}" alt="No image">
        </td>

Part of the controller that takes an array of bytes from a MultipartFile object:

@RequestMapping(value = "/register", method = RequestMethod.POST)
    public ModelAndView userRegister(@ModelAttribute("user") @Valid User user, BindingResult result, ModelMap model, @RequestParam("fileData") MultipartFile fileData) throws Exception {

            if (!fileData.isEmpty() && fileData != null) {                

                byte[] bytes = fileData.getBytes();
                user.setFileName(fileData.getOriginalFilename());
                user.setImageFile(bytes);
            }
        }

If any additional information is needed, please let me know. Thanks.

Upvotes: 9

Views: 23936

Answers (2)

Ragul
Ragul

Reputation: 1

private void updateSalesRepImage(SalesRepPhoto salesRepPhoto, Model model) throws UnsupportedEncodingException {
    AttachmentDownloadResponseData attachmentDownloadResponseData = digitalSalesRoomFacade.downloadAttachment(getAttachmentDownloadRequestData(salesRepPhoto));
    byte[] bytes = attachmentDownloadResponseData.getAttachment();
    byte[] encodeBase64 = Base64.getEncoder().encode(bytes);
    String base64Encoded = new String(encodeBase64, StandardCharsets.UTF_8);
    model.addAttribute(SALES_REP_IMAGE, base64Encoded);
}

this is not working

Upvotes: -1

Master Slave
Master Slave

Reputation: 28519

You can add a tranisent base64imageFile property to your User. It will hold the base64 encoded string of the image, which you can access in your jsp like

<img alt="img" src="data:image/jpeg;base64,${user.base64imageFile}"/>

And in your method you should do the encoding, somethig like

@RequestMapping(value = "/register", method = RequestMethod.POST)
    public ModelAndView userRegister(@ModelAttribute("user") @Valid User user, BindingResult result, ModelMap model, @RequestParam("fileData") MultipartFile fileData) throws Exception {
        if (!fileData.isEmpty() && fileData != null) {                
            byte[] bytes = fileData.getBytes();
            user.setFileName(fileData.getOriginalFilename());
            user.setImageFile(bytes);
            byte[] encodeBase64 = Base64.encodeBase64(bytes);
            String base64Encoded = new String(encodeBase64, "UTF-8");
            user.setBase64image(base64encoded);
        }
    }

IOUtils and Base64 are a handy util classes from org.apache.commons, shouldn't have a problem finding

Upvotes: 18

Related Questions