지금 db에는 String imgFileName = UUID.randomUUID() + "_" + imgFile.getOriginalFilename(); 이 코드로 뿌려진 주소만 저장되어 있거든? 외부 업로드 파일은 여기에 없는 상태. 왜냐하면 db 1개에 서버를 2개를 연동해서 쓰고 있으니까.. a서버에는 upload 파일이 있는데, b서버에는 db에 저장된 주소만 들고와서 사용한다. (브라우저에서 이미지 파일을 저장하고 있으니까) 왜 못찾아오지? 왜 JSON이지?
[ 마주한 오류 → 경로 문제 ]
잘 저장되어 있는 것 확인
<div class="row"> {{#productList}} <div class="col-md-4"> <a href="/product/{{id}}" style="text-decoration: none; color: inherit;"> <div class="card mb-3"> <div class="card-body"> <div class="d-flex flex-column align-items-center text-center"> <img src="http://localhost:8080/upload/{{imgFileName}}" width="300" height="300" style="border-radius: 5%"> <div class="mt-3"> <h4>{{name}}</h4> <div class="text-muted font-size-sm price">상품 가격 : {{price}}</div> </div> </div> </div> </div> </a> </div> {{/productList}} </div>
경로에 http://localhost:8080/ 도 같이 넣어줘야지 인식함!
이미지가 저장 된 경로가 http://localhost:8080/~~ 이니까!
이미지가 8080 서버에 저장되어 있으니까 붙여줘야함!
[ ProductResponse ]
@Data public static class MainDTO { private Integer id; private String name; private Integer price; private Integer qty; private String imgFileName; @Builder public MainDTO(Product product) { this.id = product.getId(); this.name = product.getName(); this.price = product.getPrice(); this.qty = product.getQty(); this.imgFileName = product.getImgFileName(); } }
[ ProductController ]
//메인 페이지 @GetMapping("/") public String main(HttpServletRequest request) { List<ProductResponse.MainDTO> productList = productService.findAllMain(); request.setAttribute("productList", productList); System.out.println(productList); return "/index"; }
[ ProductService ]
//상품 메인 목록 보기 public List<ProductResponse.MainDTO> findAllMain() { List<Product> productList = productRepo.findAll(); //엔티티 받아온걸 dto로 변경 return productList.stream().map(product -> new ProductResponse.MainDTO(product)).collect(Collectors.toList()); }
[ ProductRepository ]
//상품 목록보기 public List<Product> findAll() { String q = """ select * from product_tb order by id asc """; Query query = em.createNativeQuery(q, Product.class); List<Product> productList = query.getResultList(); return productList; }
Share article