'Java - How to let longblob by displayed on html page
So, my entire project seems to work for now. It is a simple system that holds records of all products of a shop. When a new product is made, a barcode will be generated. Now, this works, but I wanted to see my barcode(I can see the longblob in my db) in the output to be sure. I am probably doing it wrong, but I cannot get the image displayed.
The controller and html pages are quit irrelevant for now cause I just made them to see if I would see the barcode, but I don't. So what html tags do I need to use to get this barcode image displayed? I got the barcode object from here:
<dependency>
<groupId>net.sourceforge.barbecue</groupId>
<artifactId>barbecue</artifactId>
<version>1.5-beta1</version>
</dependency>
I will display the code from the html, controller and the object. You can find the entire project on git. https://github.com/Muschke/scruplesAntwerpenTwee.
html:
<html lang="nl" xmlns:th="http://www.thymeleaf.org">
<head th:replace="fragments::head(title='Index', css=@{/css/css.css})"></head>
<th:block th:if="${producten}">
<table>
<thead>
<th>Gebruiker</th>
<th>Consignatiebon</th>
<th>Eigenschap</th>
<th>Kleur</th>
<th>Merk</th>
<th>Maat</th>
<th>Soort</th>
<th>Barcode</th>
<th>Beschrijving</th>
<th>aankoopprijs</th>
<th>verkoopprijs</th>
<th>status</th>
<th>gestolen</th>
<th>solden</th>
</thead>
<tbody>
<tr th:each="product:${producten}" th:object="${product}">
<td th:text="*{getGebruiker().getNaam()}"></td>
<td th:text="*{getConsignatiebon().getidConsignatiebon()}"></td>
<td th:text="*{getEigenschap().getSubEigenschap()}"></td>
<td th:text="*{getKleur().getKleur()}"></td>
<td th:text="*{getMerk().getNaam()}"></td>
<td th:text="*{getMaat().getNaam()}"></td>
<td th:text="*{getSoort()}"></td>
<td>
<img class='img-thumbnail' th:src="'data:image/jpeg;base64,' + ${imgUtil.getImgData(product.getBarcode())}" />
</td>
<td th:text="*{getBeschrijving()}"></td>
<td th:text="*{getAankoopprijs()}"></td>
<td th:text="*{getVerkoopprijs()}"></td>
<td th:text="*{getStatus()}"></td>
<td th:text="*{getGestolen()}"></td>
<td th:text="*{getSolden()}"></td>
</tr>
</tbody>
</table>
<form th:action="@{/verwerken}" method="post">
<button name="barcodebutton">Genereer barcode</button>
</form>
</th:block>
</html>
controller:
@Controller
@RequestMapping("/")
class IndexController {
private final ProductService productService;
public IndexController(ProductService productService) {
this.productService = productService;
}
@GetMapping
public ModelAndView findAllProducts() {
return new ModelAndView("index").addObject("producten", productService.findAllProducts());
}
@PostMapping("/verwerken")
public ModelAndView barcodeToevoegen() {
var idnu = 52L;
productService.genereerBarcode(idnu);
return new ModelAndView("redirect:/");
}
}
object:
@Table(name = "producten")
public class Product {
@Id @GeneratedValue(strategy = GenerationType.IDENTITY)
private long productId;
@ManyToOne(fetch = FetchType.LAZY, optional = false) @JoinColumn(name = "gebruikerId")
private Gebruiker gebruiker;
@ManyToOne(fetch = FetchType.LAZY, optional = false) @JoinColumn(name = "consignatiebonId")
private Consignatiebon consignatiebon;
@OneToOne @JoinColumn(name = "eigenschapId")
private Eigenschap eigenschap;
@OneToOne @JoinColumn(name = "kleurId")
private Kleur kleur;
@OneToOne @JoinColumn(name = "merkId")
private Merk merk;
@OneToOne @JoinColumn(name = "maatId")
private Maat maat;
@Enumerated(EnumType.STRING)
private Soort soort;
private Barcode barcode;
/*de barcode mag null zijn bij input?, na input van alles, invoke methode creeër barcode.
* dat MOET dan na create worden uitgevoerd in transactional*/
private String beschrijving;
private BigDecimal aankoopprijs;
@Enumerated(EnumType.STRING)
private Status status;
private boolean gestolen;
private boolean solden;
public Product(Gebruiker gebruiker, Consignatiebon consignatiebon, Eigenschap eigenschap, Kleur kleur, Merk merk, Maat maat, Soort soort, Barcode barcode,
String beschrijving, BigDecimal aankoopprijs, Status status,boolean gestolen, boolean solden) {
this.gebruiker = gebruiker;
this.consignatiebon = consignatiebon;
this.eigenschap = eigenschap;
this.kleur = kleur;
this.merk = merk;
this.maat = maat;
this.soort = soort;
this.barcode = barcode;
this.beschrijving = beschrijving;
this.aankoopprijs = aankoopprijs;
this.status = status;
this.gestolen = gestolen;
this.solden = solden;
}
protected Product() {};
public Consignatiebon getConsignatiebon() {
return consignatiebon;
}
public Gebruiker getGebruiker() {
return gebruiker;
}
public long getProductId() {
return productId;
}
public Eigenschap getEigenschap() {
return eigenschap;
}
public Kleur getKleur() {
return kleur;
}
public Merk getMerk() {
return merk;
}
public Maat getMaat() {
return maat;
}
public Soort getSoort() {
return soort;
}
public Barcode getBarcode() {
return barcode;
}
public String getBeschrijving() {
return beschrijving;
}
public BigDecimal getAankoopprijs() {
return aankoopprijs;
}
public BigDecimal getVerkoopprijs() {
return aankoopprijs.multiply(BigDecimal.valueOf(2.5));
}
public Status getStatus() {
return status;
}
public boolean getGestolen() {
return gestolen;
}
public boolean getSolden() {
return solden;
}
/*setters voor vkp en gestolen, en voor elke OTO*/
public void setEigenschap(Eigenschap eigenschap) {
this.eigenschap = eigenschap;
}
public void setKleur(Kleur kleur) {
this.kleur = kleur;
}
public void setMerk(Merk merk) {
this.merk = merk;
}
public void setMaat(Maat maat) {
this.maat = maat;
}
public void setGestolen(boolean gestolen) {
this.gestolen = gestolen;
}
/*equals en hashtagcode maken*/
@Override
public boolean equals(Object o) {
if (this == o) return true;
if (!(o instanceof Product)) return false;
Product product = (Product) o;
return Objects.equals(eigenschap, product.eigenschap) && Objects.equals(kleur, product.kleur) && Objects.equals(merk, product.merk) && Objects.equals(maat, product.maat) && soort == product.soort && Objects.equals(beschrijving, product.beschrijving) && Objects.equals(aankoopprijs, product.aankoopprijs);
}
@Override
public int hashCode() {
return Objects.hash(eigenschap, kleur, merk, maat, soort, beschrijving, aankoopprijs);
}
/*methode om barcode te genereren als er nog geen barcode is:
* we steken het id erin, laten aanvullen met nullen tot aan 12 getallen, 13e wordt automatisch gemaakt*/
//eventueel via @þostload automatisch laten invullen
public void generateAndSetEAN13BarcodeImage() throws Exception {
if(barcode != null) {
throw new IllegalArgumentException();
} else {
var lengte = String.valueOf(getProductId()).length();
StringBuilder langeId = new StringBuilder(String.valueOf(productId));
if (lengte < 12) {
var verschil = 12 - lengte;
for (int i = 0; i < verschil; i++) {
langeId.append(0);
}
}
barcode = BarcodeFactory.createEAN13(String.valueOf(langeId));
}
}
}
So, question again: how can I make the barcode be displayed on the html page?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|