Как вывести изображения на страницу в Spring Boot?
Прошу у вас помощи по выводу изображений на страницу.
Я вижу что изображения находятся в базе данных. что они нормально добавляются вмести с товаром. Но при выводе этих изображений с деталями товара, я не вижу изображений.
При добавлении новой единицы изображения сохраняются в базу данных:
Затем после того как перехожу в вкладку "item-info" вместо картинок я вижу ярлыки:
Я понимаю, что я делаю что то не так и где то у меня ошибка, но видать мне знаний либо мозги не хватает что бы найти неправильный запрос, неправильное представление...
package com.fuji.inventory.fujiInv.models;
Models\Image.class
import jakarta.persistence.*;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import java.util.List;
@Entity
@Table(name = "images")
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Image {
@Id
@GeneratedValue(strategy = GenerationType.AUTO)
@Column(name = "id")
private Long id;
@Column(name = "name")
private String name;
@Column(name = "originalFileName")
private String originalFileName;
@Column(name = "size")
private Long size;
@Column(name = "contentType")
private String contentType;
@Column(name = "isPreviewImage")
private boolean isPreviewImage;
@Column(length = 10000000)
@Lob
private byte[] bytes;
@ManyToOne(cascade = CascadeType.REFRESH, fetch = FetchType.EAGER)
private ItemName itemName;
@ManyToMany(cascade = CascadeType.REFRESH, fetch = FetchType.EAGER)
private List<InvItem> invItem;
}
Services\AssetNameService.class
package com.fuji.inventory.fujiInv.service;
import com.fuji.inventory.fujiInv.models.Image;
import com.fuji.inventory.fujiInv.models.ItemName;
import com.fuji.inventory.fujiInv.repositories.ItemNameRepository;
import lombok.RequiredArgsConstructor;
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Service;
import org.springframework.web.multipart.MultipartFile;
import java.io.IOException;
import java.util.List;
@Service
@Slf4j
@RequiredArgsConstructor
public class AssetNameService {
public final ItemNameRepository itemNameRepository;
public List<ItemName> assetList(String assettype){
if(assettype != null) return itemNameRepository.findAllByAssettype(assettype);
return itemNameRepository.findAll();
}
public void saveAsset(ItemName itemName, MultipartFile file1, MultipartFile file2, MultipartFile file3) throws IOException {
Image image1;
Image image2;
Image image3;
if(file1.getSize() != 0){
image1 = toImageEntity(file1);
image1.setPreviewImage(true);
itemName.addImageToItemName(image1);
}
if(file2.getSize() != 0){
image2 = toImageEntity(file2);
itemName.addImageToItemName(image2);
}
if(file3.getSize() != 0){
image3 = toImageEntity(file3);
itemName.addImageToItemName(image3);
}
ItemName itemFromDB = itemNameRepository.save(itemName);
itemFromDB.setPreviewImageId(itemFromDB.getImages().get(0).getId());
itemNameRepository.save(itemName);
}
private Image toImageEntity(MultipartFile file) throws IOException {
Image image = new Image();
image.setName(file.getName());
image.setOriginalFileName(file.getOriginalFilename());
image.setContentType(file.getContentType());
image.setSize(file.getSize());
image.setBytes(file.getBytes());
return image;
}
public void deleteAsset(Long id){
log.info("Asset with ID \"{}\" ({}) was deleted", id, getItemByID(id));
itemNameRepository.delete(getItemByID(id));
}
public ItemName getItemByID(Long id){
return itemNameRepository.findById(id).orElse(null);
}
}
Constrollers/ImageController.class Я подозреваю, что ошибка где то тут. что запрос не правильный....но не могу еще найти литературу...
package com.fuji.inventory.fujiInv.controllers;
import com.fuji.inventory.fujiInv.models.Image;
import com.fuji.inventory.fujiInv.repositories.ImageRepository;
import com.fuji.inventory.fujiInv.service.ItemService;
import lombok.RequiredArgsConstructor;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.core.io.InputStreamResource;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RestController;
import java.io.ByteArrayInputStream;
@RestController //no needed to present anything
@RequiredArgsConstructor
public class ImageController {
private final ImageRepository imageRepository;
@GetMapping("/image/{id}")
private ResponseEntity<?> getImageByID(@PathVariable Long id){
Image image = imageRepository.findById(id).orElse(null);
return ResponseEntity.ok()
.header("filename", image.getOriginalFileName())
.contentType(MediaType.valueOf(image.getContentType()))
.contentLength(image.getSize())
.body(new InputStreamResource(new ByteArrayInputStream(image.getBytes())));
}
}
Repositories\ImageRepository.class
package com.fuji.inventory.fujiInv.repositories;
import com.fuji.inventory.fujiInv.models.Image;
import org.springframework.data.jpa.repository.JpaRepository;
import java.util.List;
public interface ImageRepository extends JpaRepository<Image, Long> {
List<Image> getImagesByItemName_AssetModel(String itemModel);
}
Constrollers/InvController.class
@GetMapping("/item/{id}")
public String itemInfo(@PathVariable Long id, Model model){
InvItem item = itemService.getItemById(id);
List<Image> images = itemService.getImagesByItemName_Assettype(item.getItem_model());
model.addAttribute("item", item);
model.addAttribute("images", images);
return "item-info";
}
И вот открывая item-info.ftlh я хотел бы видеть картинки, того или иного девайса. но вижу всего лишь ярлыки и ошибки
item-info.ftlh
<#list images as img>
<div>
<div>
${img.getId()}
<img src="/images/${img.getId()}" alt="">
<img src="/images/${img.id}" alt="">
<img src="${img.getId()}" alt="">
<img src="${img.id}" alt="">
</div>
<div>
${img.getOriginalFileName()}
</div>
<img src="/images/${img.originalFileName}" alt="${img.originalFileName}">
</div>
</#list>