How to show image from H2 database to Thymeleaf? - spring-mvc

Question

I'm doing spring boot, using H2 database, thymeleaf view.
I have a form to upload image to save into H2 database(byte[] image),
In thymeleaf, how to show image? anyone tell me the solution?
controller:
#RequestMapping(value = "user/new", method = RequestMethod.GET)
public String newBeans(Model model) {
model.addAttribute("usersss", new Beans());
return "userform";
}
#RequestMapping(value = "user", method = RequestMethod.POST)
public String saveUser(Beans beans) {
RepositoryUser.save(beans);
return "redirect:/users";
}
form:
<form>
<label>Avatar:</label>
<input type="file" th:field="${usersss.Avatar}"/>
<button type="submit">Submit</button>
</form>
shows:
<form>
<label>Avatar:</label>
<p>
?????????
</p>
</form>

Answer 1

Although there are many different ways to do this,here is some sample code which you can use for the same :
#RequestMapping(value = "/user/avatar/{userId}", method = RequestMethod.GET)
#ResponseBody
public ResponseEntity<InputStreamResource> downloadUserAvatarImage(#PathVariable Long userId) {
UserObject userAvatar = RepositoryUser.findUserAccountAvatarById(userId);//Could be a handle to a file stream as well,which could be incorporated accordingly
return ResponseEntity.ok()
.headers("Content-Disposition", "inline;filename=\""
+ userAvatar.getUserName() + "\"")
.contentLength(userAvatar.getImageBlob().getLength())
.contentType(MediaType.parseMediaType(userAvatar.getImageBlob().getContentType()))
.body(new InputStreamResource(userAvatar.getImageBlob().getBinaryStream()));
}
And then in your thymeleaf :
<form>
<label >Avatar :</label>
<p>
<img class="picture" th:src="#{'/user/avatar/'+${userId}}" />
</p>
</form>
Hope this helps.