如何使用Spring Boot显示从MySQL数据库读取的Blob类型图片

问题排查与解决方法 #

• 前端模板渲染错误（概率最高）
  如果你用的是SpringBoot默认的Thymeleaf模板，直接在src属性里写${contentImage}不会被正确解析，还可能被模板自动转义特殊字符，需要改用Thymeleaf的属性语法：

  <img th:src="|data:image/jpg;base64,${contentImage}|" />
  <!-- 或者拼接写法 -->
  <img th:src="@{'data:image/jpg;base64,' + ${contentImage}}" />
  

  如果是JSP模板，确认你是在支持EL表达式的页面上下文里使用，没有被全局配置禁用EL表达式。
• 数据库大字段存储截断
  你用了@Lob注解映射图片字节数组，MySQL默认的BLOB类型最大只能存储64KB内容，超过的部分会被直接截断，导致Base64编码不完整无法识别。需要修改字段定义指定更大的存储类型：

  @Lob
  @Column (name = "image", columnDefinition = "MEDIUMBLOB") // MEDIUMBLOB最大支持16MB，可按需换成LONGBLOB
  private byte[] image;
  

  改完后要同步更新数据库表结构，重新上传测试图片验证。
• 图片格式不匹配
  你在前端写死了image/jpg的MIME类型，如果上传存储的图片是png、webp、gif等其他格式，会导致浏览器无法识别编码内容。可以在上传图片的时候同步把图片的MIME类型存到数据库，渲染的时候动态替换即可。
• 编码环节验证
  可以在控制器代码里加一行日志打印base64Encoded的内容，复制内容到本地Base64转图片工具验证：如果工具也无法打开，说明是后端读取图片字节数组的环节出错，检查存储逻辑是否正常；如果工具可以打开，就100%是前端模板渲染的问题，优先排查第一个解决方法。

内容的提问来源于stack exchange，提问作者Igor Gorski