How to display jpg from db webpage?

Question

I have a table and display data from a database (mysql). I use thimeleaf. All fields are fine, but sb.cover does not show jpg (the blob column in my database). Do you have any idea how to put jpg on your webpage using thymeleaf? thanks

<tr th:each="sb, poz : ${product}"> <td th:text="${poz.count}">1</td> <td th:icon="${sb.cover}"></td> <td th:text="${sb.title}"></td> <td th:text="${sb.price}"></td> <td ><b><a th:href="@{/details}">DETAILS</a></b></td> <td ><b><a th:href="@{/cart}">ADD TO CART</a></b></td> </tr> 

Answer 1

It works for me:

 <img class="info" th:attr=" src=@ {${image}}" /> 

where 'image' is a base64 image: image = "data: image / png; base64, R0lGODlhlgCWAMQAAPz .........

in Spring Java controller:

 @RequestMapping(value = "/get_goods_detail", method = RequestMethod.GET) public String getGoodsDetail( @RequestParam(value = "itemid") final int itemid, ModelMap model){ //get image String image = "data:image/png;base64,R0lGODlhlgCWAMQAAPz8/N3d3eX.../big image model.addAttribute("image", image); return "goods_detail"; //return name of html view with thymeleaf } 

Answer 2

I am not sure if this will help you ...

 <tr th:each="sb, poz : ${product}"> <td th:text="${poz.count}">1</td> <td><img th:attr=" src=@ {${sb.cover}} , title=#{background}, alt=#{background}" style="width: 150px; height: 150px;" /></td> <td th:text="${sb.title}"></td> <td th:text="${sb.price}"></td> <td ><b><a th:href="@{/details}">DETAILS</a></b></td> <td ><b><a th:href="@{/cart}">ADD TO CART</a></b></td> </tr> 

Answer 3

You can do something like this: -
<img th:src="@{'data:image/jpeg;base64,'+${sb.encodedString}}" />

where encodedString is the image byte [] converted to base64 encoding.

This is the basic html. Check this question: Is it possible to put binary image data in html markup and then get the image, as usual, in any browser?

Hope that helps

Answer 4

Alternatively, you can display the image as shown below:

 <img th:if="*{photo != null}" th:src="@{'data:image/jpg;base64,' + *{T(org.springframework.util.Base64Utils).encodeToString(photo)}}"/>