如何从数据库网页显示jpg

Question

我已经从数据库（mysql）中获得了表和显示数据。我用百里香。所有字段都可以，但是sb.cover不显示jpg（我的数据库中的blob列）。你有什么想法如何用百里香把jpg放在网页上吗？感谢

<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

它对我有效：

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

其中"image"是base64 image:

image="data:image/png；base64，R0lGODlllgCWAMQAAPz……

in Spring Java控制器：

@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

我不确定这会对你有所帮助。。。

<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

您可以这样做：-
<img th:src="@{'data:image/jpeg;base64,'+${sb.encodedString}}" />

其中encodedString是转换为base64编码字符串的图像的byte[]数据。

这实际上是基本的html。检查这个问题：是否可以将二进制图像数据放入html标记中，然后在任何浏览器中照常显示图像？

希望对有所帮助

Answer 4

或者，您可以显示如下图像：

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

Answer 5

这个方法将字节数组转换为base64字符串，这样您就可以将产品封面转换为base64sring。您需要添加产品类别：

    public String generateBase64Image()
{
    return Base64.encodeBase64String(this.getCover());
}

在网页中，您需要调用网页中的generateBase64Image（）方法：

 <img th:src="@{'data:image/jpeg;base64,'+${product.generateBase64Image()}}"  />