31. 이미지 불러오기
-이미지 불러오기
*저장소 수정(ItemImageRepository.java)
... ...
// private Item item;
List<ItemImage> findByItem_No(long no);
... ...
*item_image_preview get 생성(SellerController.java)
// <img src="/seller/item_image_preview?itemno=14&idx=1)"
@GetMapping(value = "/item_image_preview")
public ResponseEntity<byte[]> itemImagePreview(@RequestParam("itemno") long no, @RequestParam("idx") int idx) {
List<ItemImage> list = iiRepository.findByItem_No(no);
ItemImage itemImage = list.get(idx);
HttpHeaders headers = new HttpHeaders();
if (itemImage.getImagetype().equals("image/jpeg")) {
headers.setContentType(MediaType.IMAGE_JPEG);
} else if (itemImage.getImagetype().equals("image/png")) {
headers.setContentType(MediaType.IMAGE_PNG);
} else if (itemImage.getImagetype().equals("image/gif")) {
headers.setContentType(MediaType.IMAGE_GIF);
}
ResponseEntity<byte[]> response = new ResponseEntity<>(itemImage.getImage(), headers, HttpStatus.OK);
return response;
}
**이후 http://127.0.0.1:8080/ROOT/seller/item_image_preview?itemno=6&idx=2 이런 식으로 크롬 주소창에 입력하여 이미지를 확인해야 하는데 db 과부화로 확인이 불가능했다. 그래서 다른 db(h2)를 이용하여 확인한다.
**db를 변경하여 사용할 경우 회원가입, 물품등록을 다시 해야한다.
-db 설치 및 적용
*dependency 추가(pom.xml)
<!-- h2 db embedded용 DB-->
<dependency>
<groupId>com.h2database</groupId>
<artifactId>h2</artifactId>
<scope>runtime</scope>
</dependency>
*환경설정 수정(application.properties)
**기존 오라클 db 연동 부분을 주석 잡고 h2 db를 새롭게 연동한다.
**깃허브에 업로드 해야 하므로 boot_20210914 폴더에 db01을 생성한다. (리소스 파일 안에 생성하면 계속해서 서버가 구동된다.)
... ...
#오라클 db 연동
# spring.datasource.driver-class-name=oracle.jdbc.OracleDriver
# spring.datasource.url=jdbc:oracle:thin:@1.234.5.158:11521/xe
# spring.datasource.username=id311
# spring.datasource.password=pw311
# 개발용 h2 db 연동
spring.datasource.driver-class-name=org.h2.Driver
spring.datasource.url=jdbc:h2:file:D:/boot-workspace/boot_20210914/db01
spring.datasource.username=sa
spring.datasource.password=
... ...
*보안 설정 추가(SecurityConfig.java)
... ...
// h2-console 사용하기 위해서
// restfull 사용시에도 해제
http.csrf().disable();
http.headers().frameOptions().sameOrigin();
... ...
*h2 구동(http://127.0.0.1:8080/ROOT/h2-console)
*URL 에 환경 설정에서 추가한 db01의 주소를 입력한다.
*이미지 확인(크롬)
*이미지 불러오기(insert_item_image.jsp)
... ...
<body>
<a th:href="@{/seller/select_item}">목록으로</a>
<div style="padding: 10px">
<h3>이미지 등록</h3>
<th:block th:each="i : ${#numbers.sequence(0,2)}">
<div th:text="${i}"></div>
<img th:src="@{/seller/item_image_preview(itemno=${param.no}, idx=${i})}" width="50px" height="50px" />
</th:block>
<hr />
<form th:action="@{/seller/insert_item_image}" method="post" enctype="multipart/form-data">
<input type="text" name="no" th:value="${param.no}" /><br/>
<th:block th:each="i : ${#numbers.sequence(1,3)}">
<input type="file" name="file"/><br />
</th:block>
<input type="submit" value="등록하기" />
</form>
</div>
</body>
... ...
*화면 확인
'Spring' 카테고리의 다른 글
| Spring 일지 #33 (20210914) 화면 구현(이미지 출력) (0) | 2021.09.28 |
|---|---|
| Spring 일지 #32 (20210914) 화면 구현(판매자 정보 받기) (0) | 2021.09.28 |
| Spring 일지 #30 (20210914) 화면 구현(이미지 등록) (0) | 2021.09.27 |
| Spring 일지 #29 (20210914) 화면 구현(이미지 entity, 저장소 등록) (0) | 2021.09.27 |
| Spring 일지 #28 (20210914) 화면 구현(물품 목록) (0) | 2021.09.27 |